Jump to content

[SOLVED] infinite ajax scroll appends repeat content, same as before


picarica
 Share

Recommended Posts

So hello i tried using infinite ajax scroll in my website but it appended content that was already loaded before, so it just repeated itself,i am not sure why

this is my js for the ajax scroll
 

    <script src="https://unpkg.com/@webcreate/infinite-ajax-scroll@^3.0.0-beta.6/dist/infinite-ajax-scroll.min.js"></script>
    <script>
      let ias = new InfiniteAjaxScroll('#grid-game', {
        item: '.GameTile.card.game',
        //next: document.getElementByClassName(".pagination").lastChild,
        next: '.pagination li:last-child',
        pagination: '.pagination'
      });
    </script>

and my pagination optionsa are
 

$paginatioarr = array(
  'nextItemClass' => "next",
  'previousItemClass' => "prev",
  'listMarkup' => "<ul class='pagination'>{out}</ul>",
  'itemMarkup' => "<li>{out}</li>",
  'currentItemClass' => "active",
  'numPageLinks' => 3,
  'nextItemLabel' => '>',
  'previousItemLabel' => '<',
  );

now this pagination works flawlessly by itself but the infinite ajax scroll append the same page everytime? idk why

HTML of pagination on page is simply

<ul class="pagination">
  <li>
    <a href="/"><span>1</span></a>
  </li>
  <li><a class="page active" href="/page2/">2</a></li>
  <li><a class="page active" href="/page3/">3</a></li>
  <li></li>
  <li><a class="page active" href="/page8/">8</a></li>
  <li><a class="page active" href="/page2/">&gt;</a></li>
</ul>

now idk why it has active on every pagination, but it works the last li, points to next page , it works when i click on it

so i dont know what is the problem here

maybe infinite ajax scroll log would be helpfull here

Start loading undefined infinite-ajax-scroll.min.js:11:8776
Next page triggered [pageIndex=1] infinite-ajax-scroll.min.js:11:8695
Hit scroll threshold infinite-ajax-scroll.min.js:11:8525
Finished loading infinite-ajax-scroll.min.js:11:8831
Start appending items infinite-ajax-scroll.min.js:11:8882
Finished appending 35 item(s) infinite-ajax-scroll.min.js:11:8941
Page changed [pageIndex=1] infinite-ajax-scroll.min.js:11:9079
Start loading undefined infinite-ajax-scroll.min.js:11:8776
Next page triggered [pageIndex=2] infinite-ajax-scroll.min.js:11:8695
Hit scroll threshold infinite-ajax-scroll.min.js:11:8525
Finished loading infinite-ajax-scroll.min.js:11:8831
Start appending items infinite-ajax-scroll.min.js:11:8882
Finished appending 35 item(s) infinite-ajax-scroll.min.js:11:8941
Page changed [pageIndex=2]

thanks for helping

Edited by picarica
added sovled because isolved it, solution in comment
Link to comment
Share on other sites

  • picarica changed the title to [SOLVED] infinite ajax scroll appends repeat content, same as before

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...