0

Buenas! Procurei alguns tópicos sobre a mesma dúvida que a minha - e achei, porém não consegui entender como fazer... Tenho o seguinte trecho de código:

$c = array();
$c = buscaUsuario($conexao);

while($b = mysqli_fetch_assoc($c))
{?>
   <tr>
   <td><?php echo $b["user_name"]; ?></td>
   <td><?php echo $b["user_fullname"]?></td>
   <td><?php echo $b["user_email"]?></td>
   <td>
      <div class="btn-group">
        <a class="btn btn-primary" href="#"><i class="icon_plus_alt2"></i></a>
        <a class="btn btn-danger" onclick="deletarUsuario();"><i class="icon_close_alt2"></i></a>
      </div>
   </td>

E quando clicar no botão de deletar ele vai chamar uma função js chamada deletarUsuario(), onde será passado o id daquele item em questão. Nessa função, é onde eu tenho que usar Ajax, mas não sei como fazer! Eu não sei como juntar a query de delete + javascript + ajax.

O motivo de eu querer fazer isso, é que ao clicar no botão de remover tal item, ele remova sem precisar que eu dê refresh na página.

Isto. Com a variável $b eu consigo recuperar o id, assim:

$b['id'];

Como eu não faço a mínima ideia de como usar Ajax, eu estava fazendo da seguinte forma:

   <a class="btn btn-danger" href="procura-cadastro.php?id=<?php echo   $b['id'] ?>">

    <?php
       if(array_key_exists("id", $_GET) && $_GET['id'] == $b['id'])
       {
                $a = $_GET['id'];
                $b = deletaUsuario($conexao, $a);
       }

        }
             ?>
4
  • Qual a url para excluir o usuário?
    – Laerte
    Commented 4/05/2016 às 18:56
  • Esqueci de acrescentar, desculpe. Eu tenho uma página chamada deleta-item.php e nela, é onde eu coloco a query que deleta algum item. Commented 4/05/2016 às 18:59
  • Ele recebe por parâmetro o id pra ser excluir deleta-item.php?id=1?
    – Laerte
    Commented 4/05/2016 às 19:00
  • Laerte, eu vou editar a minha pergunta com o trecho de código que coloquei aqui pra ficar melhor pra visualizar... Commented 4/05/2016 às 19:04

2 Respostas 2

1

Você vai fazer assim:

$(".deletaUser").on('Click', deletarUsuario);

    function deletarUsuario(e){

        e.preventDefault();

        dados = {
            id : $(this).data('id')
        };

        $.ajax({
            url            : "deleta-item.php",
            type           : "POST",
            dataType       : 'JSON',
            data           : dados  
        }).done(function(data) {
          // aqui você faz alguma ação para quando o ajax retornar
        });
    }

<buttom class="deletaUser" data-id="<?php echo $b['id']; ?>">Deletar</buttom>

Ai é só receber o $_POST['id'] no arquivo deleta-item.php e executar a query lá

EDIT:

Modifiquei a forma de chamar a função, tira o <a> que atualmente chama ela e coloca o botão que citei ali, ai muda o JS também.

17
  • Fiz a implementação como você me passou, porém ao clicar no botão nada acontece. Commented 4/05/2016 às 19:20
  • o jquery está configurado? da algum erro no console? o caminho pro arquivo deleta-item.php está correto (é ótimo colocar o caminho inteiro pro arquivo "http://...") Commented 4/05/2016 às 19:25
  • Agora que vi... No console está acusando que não está achando o arquivo que criei, ajax.js Commented 4/05/2016 às 19:32
  • testa ai e me avisa qualquer coisa Commented 4/05/2016 às 19:33
  • Pra testar, coloquei a função que você me passou dentro do meu código html (dentro das devidas tags é óbvio) mas no console acusa que a função deletarUsuario não está definida =/ Commented 4/05/2016 às 19:37
0

Você pode fazer da seguinte forma:

Adicione a biblioteca jQuery no head do seu documento caso não esteja utilizando. Você pode baixar aqui .

Na tr de sua tabela, coloque um id único que será utilizado para ocultar a tr após excluir. Observe que no link de excluir adicionei um data-id que será utilizado no javascript para especificar o usuário que deve ser excluido e uma classe deletar. Caso você queira utilizar o onclick você terá que passar como parâmetro o id do usuário.

HTML

<tr id="tr_<?php echo $b["id"]; ?>">
   <td><?php echo $b["user_name"]; ?></td>
   <td><?php echo $b["user_fullname"]?></td>
   <td><?php echo $b["user_email"]?></td>
   <td>
      <div class="btn-group">
        <a class="btn btn-primary" href="#"><i class="icon_plus_alt2"></i></a>
        <a class="btn btn-danger deletar" data-id="<?php echo $b["id"]; ?>"><i class="icon_close_alt2"></i></a>
      </div>
   </td>

No código que faz o processo de exclusão pelo PHP retorne [error => false] caso o usuário seja excluido com sucesso ou ['error' => 'Mensagem informando alguma inconformidade'] que será capturado no success do ajax.

JS

function deletarUsuario(id_usuario)
{
      $.ajax({
         url: 'sua url para excluir',
          type: 'post',
          data:{
           id: id_usuario
         },
         success: function(response)
         {
              if (!response.error) {

                $('#tr_'+id_usuario).fadeOut('slow');
              } else {
                alert(response.error);
              }
         },
         error: function(xhr)
         {
            alert(xhr.responseText);
         }
      });
}

$(function(){

    $(document).on('click','.deletar',function(){
        deletarUsuario($(this).data('id'));
        return false;
    });
});

Vale ressaltar que esse foi apenas um exemplo básico de implementação. Meu código pode ser melhorado.

7
  • Oi Miguel, obrigado pela resposta. Implementei seu código porém ele não faz acontecer nada - claro por provavelmente erro meu. No console também não aparece nada. Parece que a o código da função não está nem executando Commented 4/05/2016 às 20:43
  • @CesarA.Fonseca Você faz o carregamento da página via javascript ou PHP? caso utilize via javascript. você terá que mudar $('.deletar').click para $(document).on('click','.deletar',function(){}). verifique na opção Network + xhr do console para ver se o ajax foi executado Commented 4/05/2016 às 20:51
  • Eu acho que vou desistir de tentar aprender e fazer isso... Não consigo de jeito nenhum. O seu código e o do colega Daniel executam sem erro, porém não é feito a exclusão... E a query está correta, pois antes eu conseguia excluir mas a exclusão só aparecia ao carregar a página... Eu procurei tutoriais na internet mas não consegui entender nada de como usar Ajax... Parece coisa de outro mundo :( Commented 4/05/2016 às 20:59
  • Nunca use essa palavra desistir. Essa não é a opção. Caso queira aprender mais compre o livro novatec.com.br/livros/ajaxjquery ajax com jquery Commented 4/05/2016 às 21:02
  • 1
    Oi Miguel... Obrigado pelo apoio cara. Eu não posso e vou fazer de tudo pra não desistir. Por mais que JQuery, Ajax, pareçam coisas de outro mundo pra mim... Eu preciso aprender, preciso. Você poderia me explicar (ou melhor, me passar links) explicando o que algumas das tuas implementações ali fazem? Abri a documentação do Ajax mas não consegui entender muita coisa Commented 4/05/2016 às 22:48

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .