CODEWITHSUNDEEP
javascriptjqueryajaxdom
shubham sharma
shubham sharma

Reputation: 301

On ajax call to load more loading gif works only with the initially present divs

//ajax to load more

$(document).on( 'click', '.loadmorebutton', function() {
 $(this).parent().find(".loadmore").show();  
  $.ajax({
    type: "post",
    url: "something.php",
    data: variable,
    dataType: "text",                  
    success: function(data) { 
        $items = $(data); 
        $grid.append( $items )
        .masonry( 'appended', $items );
        $(this).parent().find(".loadmore").hide();   
    }.bind(this)
  });
});

Above ajax code is used to get data from something.php file and then append the result to masonry layout.

//ajax to get full content

$(document).on( 'click', '.loadmorecontent', function() {
      $(this).parent().find(".loadingdata").show();
      $.ajax({
          type: "post",
          url: someother.php,
          data: morevariable,
          dataType: "text",                  
          success: function(response) {
            $(this).parent().find(".loadingdata").hide();
          }.bind(this)
      });

Now here this ajax should be called whenever loadmorecontent is clicked and should display loadingdata gif until success it works fine for the initially present divs but not with the appended divs created afterwards by loadmorebuttoon click.

How can i make that happen for every div whether initially present or appended afterwards

Upvotes: 0

Views: 103

Answers (2)

Lucas Piske
Lucas Piske

Reputation: 370

Thats happening because your code just bind the event to the elements that are in the page at the moment. So you have to bind the events to the new elements when they are added to your page.

Upvotes: 1

Akshay Chawla
Akshay Chawla

Reputation: 613

In all situations whenever you need to perform some operation like click event or any other at first time and even after new divs get append then just make a function of that click event and call that function whenever you require.

It will work for newly append divs also.

Upvotes: 1

Related Questions