Sheldon
Sheldon

Reputation: 10077

How do I change the background colour of the table row using the fade out effect?

I would like to change the background color of the row (to red) when removing the row from the table.

This is my code so far:

$('.delete').click(function(){
    $id=$(this).attr('id');
    $row = $(this).parents('tr:first');
    $.ajax({
        url:'admin/delete_post',
        dataType:'json',
        type:'POST',
        data:'id=' + $id,
        error:function(){
            alert('There was an error');
        },
        success:function(data){
            $row.fadeOut(600,function(){
                $(this).remove();
            });
        }

    })
});

EDIT: Included markup.

<tr>
    <td>abc</td>
    <td>
       <div class="controls ">
         <textarea class="input-xlarge span10" name="content" id="textarea" rows="5"                       
         cols="45">text</textarea>
       </div></td>
    <td>
      <a class="btn delete" id="58"><i class="icon-trash"></i> Delete</a>
      <a class="btn save" ><i class="icon-ok"></i> Save</a>
    </td>
</tr>

Upvotes: 0

Views: 967

Answers (2)

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123377

success:function(data){
     $row.find('td').css('backgroundColor', 'red').end().fadeOut(600,function(){
          ...
     });
}

Upvotes: 2

thecodeparadox
thecodeparadox

Reputation: 87073

In you post there is no sing of $this, I think it should this.

$row.css('background', 'red')
    .fadeOut(600,function(){
          $(this).remove();
    });

Upvotes: 0

Related Questions