Infinite Scrolling - Get the Div ID of Dynamically Updated Content

Hixteaxia

New Member
So I'm creating infinite scrolling for my blog. It should essentially pull out ONE post after the scroll. I'm pulling it through Ajax. The problem is, Ajax is posting the same post_id which I got after one scroll. I debugged it with firebug.For example: There is already a post with the post-id = 10. After I scroll, it appends the next post with the post-id = 11. But scrolls after that, it only appends the post with the post-id = 11, it does not append the post with the post-id = 12 and so on. What is the problem? Is there a problem with this (Posted:last) selector? How do I get the id of the last dynamically updated content?Here is my Index.php:\[code\]<?phpinclude 'resources/init.php';function get_posts($post_id = null, $tag_id = null){ $posts = array(); $query = "SELECT `posts`.`post_id` AS `posts_id`, `tags`.`tag_id` AS `tags_id`, `title`, `txt_content`, `img_content`, `date_posted`,`tag_name` FROM `posts` INNER JOIN `tags` ON `tags`.`tag_id` = `posts`.`tag_id`"; if(isset($post_id)){ $post_id = (int)$post_id; $query .= " WHERE `posts`.`post_id` = $post_id"; } if(isset($tag_id)){ $tag_id = (int)$tag_id; $query .= " WHERE `tags`.`tag_id` = $tag_id"; } $query .= " ORDER BY `posts`.`post_id` DESC LIMIT 0,1"; $query = mysql_query($query); while($row = mysql_fetch_assoc($query)){ $posts[] = $row; } return $posts;}$posts = (isset($_GET['post_id'])) ? get_posts($_GET['post_id']) : get_posts();?><!DOCTYPE html><html><head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script></head><body><a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/add_post.php">Add a Post</a> | <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/add_tag.php">Add a Tag</a> | <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/tag_list.php">Show Existing Tags</a> | <a hrefhttp://stackoverflow.com/questions/15457514/= ""></a><p><div id = "AddPosts"><?phpforeach($posts as $post){?> <div class = "Posted" id = "<?php echo $post['posts_id']; ?>"> <h2><a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/looks/<?php echo $post['posts_id']; ?>-<?php $strings = array(" "); echo str_replace($strings, '-', preg_replace('/[^a-zA-Z0-9 s]/', '', $post['title'])); ?>"><?php echo $post['title'];?></a></h2> <div><?php echo nl2br($post['txt_content']);?></div> <div><img src = "http://localhost/simpleblog/<?php echo $post['img_content'];?>"></div> <p>Posted on <i><?php echo date("F dS\,\ Y", strtotime($post['date_posted'])); ?></i> in <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/tags/<?php echo $post['tags_id'];?>"><?php echo $post['tag_name']; ?></a></p> <div><a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/edit_my_looks/<?php echo $post['posts_id'];?>">Edit This Post</a> | <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/delte_my_post/<?php echo $post['posts_id'];?>"> Delete This Post</a></div> </div><?php}?></div><center><img src = "http://stackoverflow.com/questions/15457514/loader.gif" id = "loading-img" width = "200" height = "200" style = "display:none" /></center><script>$(window).scroll(function(){ if ($(window).scrollTop() == $(document).height() - $(window).height()){ $('#loading-img').show(); var post_id = $('.Posted:last').attr('id'); $.post("add_more_posts.php", {post_id: post_id} , function(data){ if(data){ $('#loading-img').fadeOut(); $('#AddPosts').append(data); }else{ $('#AddPosts').append('Finished Loading!'); } }); }});</script></body></html>\[/code\]Add_more_posts.php\[code\]<?phpinclude 'resources/init.php';function load_more_posts($post_id = null, $tag_id = null){ $posts = array(); $query = "SELECT `posts`.`post_id` AS `posts_id`, `tags`.`tag_id` AS `tags_id`, `title`, `txt_content`, `img_content`, `date_posted`,`tag_name` FROM `posts` INNER JOIN `tags` ON `tags`.`tag_id` = `posts`.`tag_id`"; if(isset($post_id)){ $post_id = (int)$_POST['post_id']; $query .= " WHERE `posts`.`post_id` < $post_id"; } if(isset($tag_id)){ $tag_id = (int)$tag_id; $query .= " WHERE `tags`.`tag_id` = $tag_id"; } $query .= " ORDER BY `posts`.`post_id` DESC LIMIT 0,1"; $query = mysql_query($query); while($row = mysql_fetch_assoc($query)){ $posts[] = $row; } return $posts;}$posts = (isset($_POST['post_id'])) ? load_more_posts($_POST['post_id']) : load_more_posts();?><!DOCTYPE html><html><head></head><body><?phpforeach($posts as $post){?> <h2><a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/looks/<?php echo $post['posts_id']; ?>-<?php $strings = array(" "); echo str_replace($strings, '-', preg_replace('/[^a-zA-Z0-9 s]/', '', $post['title'])); ?>"><?php echo $post['title'];?></a></h2> <div><?php echo nl2br($post['txt_content']);?></div> <div><img src = "http://localhost/simpleblog/<?php echo $post['img_content'];?>"></div> <p>Posted on <i><?php echo date("F dS\,\ Y", strtotime($post['date_posted'])); ?></i> in <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/tags/<?php echo $post['tags_id'];?>"><?php echo $post['tag_name']; ?></a></p> <div><a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/edit_my_looks/<?php echo $post['posts_id'];?>">Edit This Post</a> | <a hrefhttp://stackoverflow.com/questions/15457514/= "http://localhost/simpleblog/delte_my_post/<?php echo $post['posts_id'];?>"> Delete This Post</a></div><?php}?></body></html>\[/code\]
 
Back
Top