Facebook

Wednesday, November 11, 2015

Simple Ajax Pagination Script on Scroll Down


Credit: Jaspreet Singh

<script type="text/javascript">
    jQuery(document).ready(function($) {
    //Set current page to 1     var count = 1;
    $(window).scroll(function(){
          if  ($(window).scrollTop() == $(document).height() - $(window).height()){
             //Load artices of current page              loadArticle(count);
             //Increment current page after loading              count++;
          }
    });

    function loadArticle(pageNumber){
          //Show loader           $(".sk-circle").removeClass("hideme");
          //Get search string           var search_string = $("#search_name").val();
          $.ajax({
              url: "ajaxsearch.php",
              type:"POST",
              data: "search_string="+search_string+"&page_no="+ pageNumber,
              success: function(html){
                  //Hide loader                   $(".sk-circle").addClass("hideme");
                   if(html == "error"){

                    } else {
                        $("#search_list").append(html);
                    }
                      // This will be the div where our content will be loaded
              }
          });
      return false;
    }

    });

</script>

Server side code
$search_string = $_POST['search_string'];
$perpage = 10;
$limit = $pages*$perpage;
$search = 'SELECT * FROM `table_name` WHERE `description` like '%$search_string%' or `PartNo` like '%$search_string%' and status='1' order by id ASC limit $limit, $perpage';

No comments:

Post a Comment