Use fadeOut('slow') in Ajax Array that contains several id

Question

Hello,

I have an ajax function, in which I remove several lines in an html table.

The function collects several id that will be deleted, I would like to make a fadeOut('slow') when the function is executed.

Part of the Table

<tr id="<?php echo $produto['idarquivo']; ?>" >

This id is already being collected in function ajax, i would like to use the effect on the part where the table is removed.

JS Code with Ajax Function

(tried to do the fadeOut('slow') be executed, but I could not (already tested in debugger and the ajax delete function is executed).

$('#btn_delete').click(function(){

    if(confirm("Deseja deletar as linhas selecionadas?"))
    {
        var id = '';

        $('.checkbox:checked').each(function(){
            id += $(this).val()+',';
        });

        if(id == '' || id == ',') 
        {
            alert("Selecione uma linha para deletar");
        }
        else
        {
            $.ajax({
             url:'deletar.php',
             type:'POST',
             data:{ids:id},
             success:function()
             {
                for(var i=0; i<id.length; i++)
                {
                    $('tr#'+id[i]+'').css('background-color', '#ccc');
                    $('tr#'+id[i]+'').fadeOut('slow');
                }
            }

        });
    }

}
else
{
    return false;
}
});

delete.php

<?php include_once('conexao.php');

$ids = $_POST['ids'];

print_r($ids);

$exp = explode(",", $ids);

foreach($exp as $id){

    $query = "DELETE FROM arquivo WHERE idarquivo = '$ids'";
    $resultado = mysqli_query($con, $query);
}

?>

Answer 1

My suggestion is, you might have a string of ids like this: foo,bar,baz have this in an array and treat everything as an array/collection...

Thus:

$('#btn_delete').click(function() {
  if (confirm("Deseja deletar as linhas selecionadas?")) {
    var ids = $('.checkbox:checked').map(function() {
      return this.value;
    }).get();

    if (ids.length == 0) {
      alert("Selecione uma linha para deletar");
    } else {
      $.ajax({
        url: 'deletar.php',
        type: 'POST',
        data: {
          ids: JSON.stringify(ids)
        },
        success: function() {
          for (var i = 0; i < id.length; i++) {
            $('tr#' + id[i]).css('background-color', '#ccc').fadeOut('slow');
          }
        }
      });
    }
  } else {
    return false;
  }
});