Infinite Ajax Scroll, a jQuery plugin

Hello JeroenThere is a bug in IE 8 . Your script does not work in IE 8. I found the issue and corrected it. Open jquery.ias.js and go to line 153 You will find  item = items[i];replace this line with var item = items[i]; and the problem will solve.ThanksVarun Mishra

Hi Varun, thanks for your bug report, I really appreciate it. I’ll look into it and fix the issue as needed.

P.S. I would love to hear where you used IAS, if possible.

the website is not live yet. I will let  you know once the site is up.

[...] Demo | Source [...]

Hi all, could you give me example (with HTML sources (ALL files)), please?
A lot thanks :)
because if I download, there are only  jquery.ias.js, jquery.ias.min.js, jquery.ias.css

thanks! :)

HI,
very thanks for the great script….but i am having problem after implementing the script….the listing is been repeated in http://www.yaabbee.com/category.php?id=1#/page/2
http://www.yaabbee.com/category.php?id=1#/page/3
http://www.yaabbee.com/category.php?id=1#/page/4

u can chk it online….it keeps repeating the list

The HTML of you pagination element is not correct. It has errors and duplicate elements. Make sure the next-post element has a unique class.

Check the github page (https://github.com/webcreate/Infinite-Ajax-Scroll) for installation instructions.

hi,
thank you very much for your reply….but as our search the pagination code we used is this one

<?php
$sql = "SELECT COUNT(post_id) FROM bah_posting where catg_id='$categoryId'";
$rs_result = mysql_query($sql);
$row2 = mysql_fetch_row($rs_result);
$total_records = $row2[0];
$total_pages = ceil($total_records / 15);

  //include ('includes/tiwtter_login.php');
for ($i=1; $i<=$total_pages; $i++) {

           
            echo "“.$i.” “;
};
?>

the problem is $_GET["page"] can not get the page value becuase the url style is like this

http://localhost/ya_pg/category.php?id=1&page=1

and ur script create hash url

http://localhost/ya_pg/category.php?id=1&#/page/1

please guide me to a solution for this problem?????

alfarqi@hotmail.com

Hi again,
I think your demo is having the same problem which i have which is repeating of the listingz

IAS does get the correct page value. It loads http://localhost/ya_pg/category.php?id=1&page=1 in the background. The problem is the HTML of your pagination. Because the way you built it, it can’t select the correct ‘next-page’-link, instead it always finds the ‘next-page’-link to the first page.

Build a pagination like this and it will work:

<div class=’pagination’>
  <a href=’?page=1′ class=’prev-link’>prev
  <a href=’?page=3′ class=’next-link’>next
</div>

Nope, I made it like that on purpose.

Very Very Great Thanks for your help…..my problem has solved with your guidance

Hi Fiege,I wonder if u can help me in solving this problem……your script pagination will start loading for example after 20 records (or whatever number we select) using ajax ….Is it possible to do the same from 1st 20 records. to be loaded as ajax I mean applying the ajax loading with preloading image option from the 1st record as its in twitter style.i would like to have your idea regarding this and how we can do it using your script.Please help me in solving that…cuz i am really stucked in the middle:(Regards,farooq

I will tell you what i have done…..I was looking to load my listing using ajax for that I kept jQuery Ajax code to load the listing file like this:

head.php

$.ajax({
url : “loader.php”,
type:”post”,
data:datapage,
success : function (data) {
$(“#content_loader”).html(data);

}
});

loader.php

<?php
//print my list code

1){ // is the page number more than 1?
$prev = ($page – 1); // if so, do the following. take 1 away from the current page number
echo ‘Previous‘; // echo a previous page link
}

if($page < $total_pages){ // is there a next page?
$next = ($page + 1); // if so, add 1 to the current
echo 'Next‘;echo $page;

}
?>

and category.php file which will load the listing. The code is working perfect with normal next and previous pagination without any problem

but once i add your script in head.php file the pagination will not work….

Tell me if i am doing right or wrong……and that why i have asked you yesterday if we can do that thing only using your code rather than using jquery ajax

please help me in this

regrads,
farooq

hi, to make it easier as us stated in your article

IAS will now handle your webpage as follows:

Monitor the scroll event for reaching the last item elementInsert a loader imageLoad the next page using AJAX ———Is it possible to make the first page load as ajax also by default Insert each new item after the last item

any one can help????????

Is there any hope, or should i find other solution?

I’ve send you an email concerning your request.

[...] Infinite AJAX Scroll es un plugin jQuery que sirve para recargar contenido sin la necesidad de refrescar la pagina completa, algo exactamente igual a lo que hacen sitios como Facebook o Twitter que utilizan la posición de la barra de scroll para cargar contenido bajo demanda. Un tema del que ya hablamos hace unos cuantos meses cuando escribí un post sobre el posible fin de la paginación convencional. [...]

[...] google_ad_width = 468; google_ad_height = 60; // ]]> // < ![CDATA[ // ]]>site officiel: infinite ajax scroll Abdelwahed Catégorie: [...]

[...] Para conocer más sobre esta herramienta haz click AQUI [...]

[...] 13. Infinite Ajax Scroll, a jQuery plugin [...]

[...] 13. Infinite Ajax Scroll, a jQuery plugin [...]

Sorry my english is very poor… So I’ll do it in dutch: Ik heb in de content die van pagina 2 die wordt ingeladen nog jquery functionaliteit staan.Deze wordt helaas niet opgepakt. Waarschijnlijk moet ik deze opnieuw aantrappen. Ik heb al geprobeerd met extra javascript in het deel wordt ingevoegd. Dit wordt echter nog steeds niet opgepakt. Weet jij zo een manier om dit wel voormekaar te krijgen?

Hi Bosmamultimedia, is het nog gelukt met de instructies die ik je per e-mail heb gestuurd?

Hey Fieg,

Ik heb hetzelfde probleem als Bosmamultimedia. (de bestaande jquery functionaliteit in elke item vervalt als je op pagina 2 komt.) Zou je mij de instructies kunnen sturen die je hem ook heb gestuurd?
Bedankt alvast

oh and another question.. but I would understand if you don’t have time to reply on this one. I’m also using the Masonry plugin to position all the items. They provide a tutorial on integrating ‘infinite scroll’ by Paul Irish to their plugin. But I like your plugin better than the Paul Irish plugin, because you provide the ‘back function’ that navigates back to the clicked post. When I try to implement your plugin in combination with Masonry, the same way they provide the tutorial for the Paul Irish infinite scroll, the posts of page 2 are being displayed on the same page as page 1 (under the other images), instead of loading page 2 under page 1. Do you maybe have any idea how to fix this? Again, I totally understand if you don’t have the time to answer this question, so than I’ll just have to puzzle a bit more ;)

your plugin is really cool!
but i have one question…
can i make scroll event come from div? ( not from window scroll )

Hello and thank you for making this available. I’ve implemented this on a .Net page. I have it almost working 100% but i’m running into one problem. I have a drop down on my page which when you select a new value, should automatically redirect you to a page. However, if i page down and cause IAS to fire and load up another page of content and then try to use the drop down, i get the following error: 

System.ArgumentException: Invalid JSON primitive: ,. 

This error occurs before the code for the dropdown even fires. This page is behind a password, but if you’d like to view it, i can give you a url and a password to access it. The page will be public once i have this working.

The javascript that .Net renders for the drop down box looks like this:onchange=”javascript:setTimeout('__doPostBack('ctl00$ddlSort','')', 0)” 

Not sure if this is related or not, but is it possible to implement IAS without it changing the url in the browser to /page/#  ?

Thanks to Sachaoost for donating via paypal, IAS now has support for the jQuery Masonry plugin. Check the documentation on Github (https://github.com/webcreate/Infinite-Ajax-Scroll/blob/master/README.textile) on how to implement it.

I don’t think that is possible. Maybe you can give an example of what you exactly want?

Hi Ian, can you submit a feature request on GitHub for this? (https://github.com/webcreate/Infinite-Ajax-Scroll/issues)

Thank you for reply~
I just wanna make blog page like 

http://vimeo.com

infinite scroll in div…
and link my blogpage that I’ve been making

http://red419.net/guitar

Hi, I like how your script work but can you provide us with downloadable demo? I mean like an example which we can study :D thx