Remove record in database without giving refresh

Navigation
1

Good! I looked for some topics about the same doubt as mine - and I found, but I could not understand how to do it ... I have the following code snippet: 

$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>

And when you click on the delete button it will call a js function called deleteUsuario (), where the id of that item will be passed. In this function, it's where I have to use Ajax, but I do not know how to do it! I do not know how to join the delete + javascript + ajax query.

The reason I want to do this is that by clicking the remove this item button, it removes without needing to refresh the page.

This. With the variable $ b I can retrieve the id, like this: 

$b['id'];

As I have no idea how to use Ajax, I was doing the following: 

   <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);
       }

        }
             ?>
    
asked by anonymous 04.05.2016 / 20:53

2 answers

1

You'll do it like this: 

$(".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>

Then just get the $_POST['id'] in the file deleta-item.php and execute the query there

EDIT:

I changed the way I call the function, takes out the <a> that currently calls it and puts the button I mentioned there, then change the JS as well.

    
04.05.2016 / 21:12
0

You can do this as follows:

Add the jQuery library to the head of your document if you are not using it. You can download here .

At the bottom of your table, put a unique id that will be used to hide tr after deleting. Note that in the delete link I've added a data-id that will be used in the javascript to specify the user to be deleted and a delete class. If you want to use onclick you will have to pass the id of the user as a parameter.

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>

In the code that does the delete process by PHP return [error => false] if the user is successfully deleted or ['error' => 'Mensagem informando alguma inconformidade'] that will be captured in ajax success.

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;
    });
});

It should be noted that this was just a basic example of implementation. My code can be improved.

    
04.05.2016 / 22:16
Direct sum in PHP How to use the Chr () function in C ++ Builder?