using show more button show infinite content

Solutions on MaxInterview for using show more button show infinite content by the best coders in the world

showing results for - "using show more button show infinite content"
Mike
10 Sep 2019
1  /*Change infinite scroll into load more button */
2
3  //prevent the infinite scroll from running with a hack 
4  $('.um-activity-wall').attr('data-single_post', 'TRUE');
5
6  //set up a function which inserts a load more button, and removes the animated gif
7  function ioh_append_loadmore_btn() {
8      var lastDiv = $('.um-activity-load:last');
9      lastDiv.html('<div class="ioh_load_more btn btn-primary">Load more</div>');
10      lastDiv.show();
11      lastDiv.addClass('ioh_load_more_container');
12      lastDiv.removeClass('um-activity-load');
13  }
14  ioh_append_loadmore_btn();
15
16  //add an event listener to the added load more button, which executes the loading. 
17  $(document).on('click', '.ioh_load_more', function() {
18      var wall = jQuery('.um-activity-wall');
19      if ( wall.length > 0
20          && jQuery(window).scrollTop() + jQuery(window).height() >= wall.offset().top + wall.height()
21          // && jQuery('.um-activity-widget:not(.um-activity-new-post):visible').length >= jQuery('.um-activity-wall').attr('data-per_page')
22          && Loadwall_ajax === false) {
23
24          Loadwall_ajax = true;
25          var lastDiv = $('.ioh_load_more_container:last');
26          lastDiv.addClass('um-activity-load');
27
28          jQuery.ajax({
29              url: wp.ajax.settings.url,
30              type: 'post',
31              data: {
32                  action: 'um_activity_load_wall',
33                  offset: jQuery('.um-activity-widget:not(.um-activity-new-post):visible').length,
34                  user_id:  wall.data('user_id'),
35                  user_wall: wall.data( 'user_wall' ),
36                  hashtag: wall.data('hashtag'),
37                  nonce: um_scripts.nonce
38              },
39              success: function( data ) {
40                  jQuery('.um-activity-load').hide();
41
42                  if ( data === '' ) {
43                      Loadwall_ajax = true;
44                  } else {
45                      jQuery('.um-activity-wall').append( data );
46                      Loadwall_ajax = false;
47                  }
48
49                  ioh_append_loadmore_btn();
50
51              },
52              error: function (e) {
53                  console.log('UM Social Activity Error', e);
54              }
55          });
56      }
57
58  });
59
Anna
10 Apr 2017
1.ioh_load_more_container {
2  margin-top: 25px;
3}
4
5.ioh_load_more {
6  cursor:pointer;
7}