Infinite scrolling MySQL PHP jQuery -

Infinite scrolling MySQL PHP jQuery -

the code below shows infinite scrolling function jquery , php. have 2 problems can't seem figure out...

my first problem: know, it's called "infinite" scrolling. ridiculously enough, content loaded when scrolling downwards bottom of page "infinite" (repeating itself, when not want duplicates). believe has if-statements in jquery-function.

here's jquery part:

jquery.fn.portfolio_addon = function(addon_options) { "use strict"; //set variables var addon_el = jquery(this), addon_base = this, img_count = addon_options.items.length, img_per_load = addon_options.load_count, $newels = '', loaded_object = '', $container = jquery('.image-grid'); $(window).scroll(function() { if($(window).scrolltop() + $(window).height() == $(document).height()) { $newels = ''; loaded_object = ''; var loaded_images = $container.find('.added').size(); if ((img_count - loaded_images) > img_per_load) { var now_load = img_per_load; } else { var now_load = img_count - loaded_images; } if ((loaded_images + now_load) == img_count) jquery(this).fadeout(); if (loaded_images < 1) { var i_start = 1; } else { var i_start = loaded_images+1; } if (now_load > 0) { // load more elements (var = i_start-1; < i_start+now_load-1; i++) { loaded_object = loaded_object + '<div data-category="'+ addon_options.items[i].category +' " class="blogpost_preview_fw element '+ addon_options.items[i].category +'"><div class="fw_preview_wrapper"><div class="gallery_item_wrapper"><a href="'+ addon_options.items[i].url +'" ><img src="'+ addon_options.items[i].src +'" alt="" class="fw_featured_image" width="540"><div class="gallery_fadder"></div><span class="third_party_'+addon_options.items[i].thirdparty +'"></span><span class="third_party_mobile_'+addon_options.items[i].thirdparty_mobile +'"></span><span class="description_tag"><span class="actual_description">'+ addon_options.items[i].title +'</span></span> <span class="price_tag"><span class="actual_price">€ '+ addon_options.items[i].price +'</a></div><a href="'+ addon_options.items[i].url +'"><div class="grid-port-cont"><h6>'+ addon_options.items[i].title +'</h6><hr class="trennlinie"><span>'+ addon_options.items[i].description +'</span><hr class="trennlinie"><span>preis: eur '+ addon_options.items[i].price +'</span>&nbsp;·&nbsp;<span>ort: '+ addon_options.items[i].postcode +' '+ addon_options.items[i].city +'</span></div></a></div></div></div></div>'; } $newels = jquery(loaded_object); $container.isotope('insert', $newels, function() { $container.isotope('relayout'); }); }} }); }

and part of php:

<?php // load more on default if($condition == true){ //connect database //-select database utilize $start1 = 40; // starts @ 40 because 40 items load when page loads $limit1 = 20; //-query database table $sql="select * table city '%".$featured."%' order id limit $start1,$limit1"; //-run query against mysql query function //-create while loop , loop through result set //-assign &numrows variable ?> <script> items_set = [ {src : '<?php echo $row['imageurl']; ?>', url : '<?php echo $row['url']; ?>', category: '<?php echo $row['detailcategory']; ?>', title : '<?php echo $row['name']; ?>', description : '<?php echo $row['description']; ?>', cost : '<?php echo $row['price']; ?>', postcode : '<?php echo $row['postcode']; ?>', city : '<?php echo $row['city']; ?>', thirdparty : '<?php echo $row['thirdparty']; ?>', thirdparty_mobile : '<?php echo $row['thirdparty']; ?>'} ]; jquery('#list').portfolio_addon({ load_count : <?php echo $numrows;?>, items : items_set }); </script> <?php }} ?>

here's sec problem: have 49 items (rows) in database. code shows, 40 of them displayed when page loads. when scroll downwards page (trigger loading-function) 6 new items show up, while 9 should (all 49 should called query using). somehow seems mysql-query not have effect @ all.

i appreciate help! thanks.

i hope getting right:

the same content beingness loaded on , on again.

i think issue due to:

loaded_object = loaded_object + 'lots of more content';

in loop. loaded object attaches infront of new content every time , attached dom

you want your:

loaded_object = 'lots of more content';

to loaded.. old stuff in dom allready , doesnt need part of "loaded_object"

edit: marcb hast commented below question: select statement fetching same info on , on again

php jquery mysql