test
test

Reputation: 63

Hide a specific div after ajax success data

I am trying to hide a specific div content after jquery ajax success.

Live demo: http://jsfiddle.net/t922q/

Some of jquery code:

  $('.deletethisconent').click(function() {
    // $.ajax({   ....
         success: function(data){
         $(this).closest('.container').hide(); 
         $(".delete_status").html(data);

     });

How can I hide one the targeted div after ajax success? Thank you.

Upvotes: 1

Views: 7903

Answers (3)

Johan
Johan

Reputation: 35194

this refers to the jqXHR object which is the third argument in the success handler.

success:

Function( PlainObject data, String textStatus, jqXHR jqXHR )

You need to store a reference to the outer this in a variable if you want to reach it:

$('.deletethisconent').click(function() {

     var that = this;

     $.ajax({  
         url: 'echo.php', 
         success: function(data){
             $(that).closest('.container').hide(); 
             $(".delete_status").html(data);
         }
     });
});

Upvotes: 4

user1823761
user1823761

Reputation:

Add a reference to this in your click function and then use it:

$('.deletethisconent').click(function() {
    var mainElement = this;

    $.ajax({
        success: function(data) {
            $(mainElement).closest('.container').hide(); 
        }
    });
});

Upvotes: 0

Jared Eitnier
Jared Eitnier

Reputation: 7152

It seems like you want to hide the data, so:

$('.deletethisconent').click(function() {
    // $.ajax({   ....
    success: function(data){
         $(this).closest('.container').css('display', 'none'); 
         $(".delete_status").html(data);

 });

Upvotes: 0

Related Questions