How to get the number of rows as a jQuery variable

Question

I am very new to jQuery and cannot handle how I can do this. I have a table in my database called user_thoughts . I am trying to implement an infinity scroll function whose current should alert("bottom") when thoughts for the user exceed 10.

Each user can upload thoughts and on their profile_page , only their thoughts are displayed. By default, I need to display 10 posts, and then when the user scrolls to the bottom of the page, he will automatically download another 10 posts that the user wrote.

Here is my infinity_scroll script:

 $(document).ready(function(){ var load = 0; $(window).scroll(function(){ if($(window).scrollTop() == $(document).height() - $(window).height()){ load++; // start AJAX $.post("inc/ajax.php", {load:load},function (data){ $(".userposts_panel").append(data); // class alert ("bottom"); }); } // if closed }); }); 

I need an if statement surrounding alert() , which looks something like this: if the user has over 10 posts and the user has scrolled to the bottom, then display more data - For now, I'm just using alert () for testing. If the user only made 2 messages, for example, and the user scrolls down, alert() should not occur.

My thinking is that I need a var that receives the number of messages for the user, and then the user, to indicate if conditions like

  if (posts >=10){ alert("bottom"); } 

Is this the best way to do this? If not, what approach should I take?

Edit:

How each line is displayed (separate record):

  <div class=userposts_panel> <?php // PHP query here, leading to this echo ... echo "<div class='message_wrapper'> <div class='where_msg_displayed'> <div class='more_options' style='float: right;'> <li class='dropdown'> <a 'href='#' class='dropdown-toggle' data-toggle='dropdown' role='button' aria-haspopup='true' aria-expanded='false'> More <span class='caret'></span></a> <ul class='dropdown-menu'> <li><a href>Flag Post <span id='options' class='glyphicon glyphicon glyphicon-flag' aria-hidden='true'></span> </a></li>"; if ($user == $username){ echo "<li>"; ?> <a href="/inc/del_post.php?id=<?php echo $thought_id;?>">Delete <?php echo "<span id='remove' class='glyphicon glyphicon-remove' aria-hidden='true'></span> </a></li>"; } echo" </ul> </li> </div>"; if ($shared == "no"){ echo "<img class='img-size' src='images/anomolous.jpg' />"; } else { echo "<img class='img-size' src='$profile_pic2'/>"; } echo "<span style='margin-left: 10px;'>$message_content </span> <br/> <br/>"; if ($attachent !=""){ echo "<img src='user_data/attached_images/$attachent' style='width: 230px; height=230px;'/>"; } echo " </div> <div class='where_details_displayed'> <a href='profile_page/$thoughts_by'> <b> $name_of_user </b> </a> - $date_of_msg <div class='mini_nav' style='float: right;'> <a href='/inc/favourite_post.php?id=";?><?php echo $thought_id;?><?php echo "'> <span class='glyphicon glyphicon-heart-empty' aria-hidden='true' style='padding-right: 5px;' onclick='changeIcon()'></span> </a> | <a onclick='return toggle($thought_id);' style='padding-left: 5px;'> Comments ($num_of_comments) </a> </div> <div id='toggleComment$thought_id' class='new_comment' style='display:none;'> <br/> $comment_posted_by said: $comment_body </div> </div> </div>"; ?> </div> // userposts_panel closed. 

Answer 1

You can get the length of your posts by counting the number of elements of a particular class on your page, for example. Say you use the postRowWrap wrapper class to display each message, then

 var postLen = $('.userposts_panel').find('.postRowWrap').length 

can indicate the length of the current number of messages.

If you are using <table> , then

 var postLen = $(".userposts_panel").find('tr').length 

can give you the length of messages in sight.

Now you can do:

 if(postLen > 10){alert()} 

EDIT: Ah, a little late from my end, but to complete this, in your case -

 postLen = $(".userposts_panel").find('.message_wrapper').length //which is, in the wrapper class find number of .message_wrapper which signifies number of messages you have as DOM in your HTML 

will give you the number of posts on your page. Hope this helps. :)