Ajax paging system help?

[eevan79]

I am trying to implement Ajax paging system based on this tutorial

 

It's working with Ajax, but I need to update current page.

 

For example if I have pages like [1],2,3,4,5,6 and I clicked on page 3, I get need to get this 1,2,[3],4,5,6.

Ajax shows data for that page, but current page still hold on [1]...its not refreshed, and I dont have idea how to do it.

 

Here is my code:

Ajax script:

<script type="text/javascript">
       function handleHttpResponse() {  
       document.getElementById("divActivities").innerHTML = "<table style='width:80%;margin-left:22px;'><tr><td height='180'><div align='center'><img style='vertical-align: middle;' src='img/loader.gif'> Loading...</div></td></tr></table>";    

        if (http.readyState == 4) {
              if(http.status==200) {
                  var results=http.responseText;
              document.getElementById('divActivities').innerHTML = results;
              }
              }
        }
        
        function requestActivities2(url) {
        document.getElementById("divActivities").innerHTML = "Loading...";        
            http.open("GET", "" + url , true);
            http.onreadystatechange = handleHttpResponse;
            http.send(null);
        }
function getHTTPObject() {
  var xmlhttp;

  if(window.XMLHttpRequest){
    xmlhttp = new XMLHttpRequest();
  }
  else if (window.ActiveXObject){
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    if (!xmlhttp){
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
    
}
  return xmlhttp;

  
}
var http = getHTTPObject(); // We create the HTTP Object

</script>

 

pagination.php

 

             $rowsperpage = $result_per_page;
              $totalpages = ceil($numrows / $rowsperpage);
              if (isset($_GET['page']) && is_numeric($_GET['page'])) {
                  $currentpage = (int)$_GET['page'];
              } else {
                  $currentpage = 1;
              }
              if ($currentpage > $totalpages) {
                  $currentpage = $totalpages;
              }
              if ($currentpage < 1) {
                  $currentpage = 1;
              }
              if ($totalpages <= 1) {
                  $totalpages = 1;
              }

              $offset = ($currentpage - 1) * $rowsperpage;
              if (isset($_GET['page']) AND is_numeric($_GET['page'])){
                          $current_page = safeEscape($_GET['page']);
                          }

                          if ($current_page == "") {
                              $current_page = 1;
                          }
              $range = 3;
              if ($range >= $totalpages) {
                  $range = $totalpages;
              }
              
              if ($current_page > $totalpages) {$current_page = $totalpages;}
              
              
              echo '<form name="myForm" method="post" action=""><table><tr><td style="padding-right:24px;" align="right" class="pagination"> <b>Page ' . $current_page . ' of ' . $totalpages . '</b> [' . $numrows . ' maches]     ';
              if ($currentpage > 1) {
              echo '<input type="button" onclick="requestActivities2(\'includes/ajax_get_top.php?'.$gplay.$un.$ord.$sorted.'&page=1\')" class="inputButton"  value="<<" />';

                  $prevpage = $currentpage - 1;
                  echo '<input type="button" onclick="requestActivities2(\'includes/ajax_get_top.php?'.$gplay.$un.$ord.$sorted.'&page='.$prevpage.'\')" class="inputButton"  value="<" />';

              }
              for ($x = ($currentpage - $range); $x < (($currentpage + $range) + 1); $x++) {
                  if (($x > 0) && ($x <= $totalpages)) {
                      if ($x == $currentpage) {
                          echo " [<b>$x</b>] ";
                      } else {
                      echo '<input type="button" onclick="requestActivities2(\'includes/ajax_get_top.php?'.$gplay.$un.$ord.$sorted.'&page='.$x.'\')" class="inputButton"  value="'.$x.'" />';
                      }
                  }
              }
              if ($currentpage != $totalpages) {
                  $nextpage = $currentpage + 1;
                  echo '<input type="button" onclick="requestActivities2(\'includes/ajax_get_top.php?'.$gplay.$un.$ord.$sorted.'&page='.$nextpage.'\')" class="inputButton"  value=">>" />';
                  echo '<input type="button" onclick="requestActivities2(\'includes/ajax_get_top.php?'.$gplay.$un.$ord.$sorted.'&page='.$totalpages.'\')" class="inputButton"  value=">>" />';
              }
              
              echo '</td></tr></table></form>';

And in ajax_get_top.php I pull data from database and show them in divs

<div id='divActivities'></div>

 

I dont have idea how to refresh current page (button).

[gamesmstr]

I see one major problem right off the bat.  Your requestActivities2 function isn't referencing any XMLHTTP request. See if this helps.

 

function requestActivities2(url) {
        var http=getHTTPObject();
        document.getElementById("divActivities").innerHTML = "Loading...";        
            http.open("GET", "" + url , true);
            http.onreadystatechange = handleHttpResponse;
            http.send(null);
        }

 

[eevan79]

Its not working. 

 

With my function it working fine, but only dont know how to refresh pages.

Also I quit this. I'll use basic pagination system.

 

 

[eevan79]

Anyway here how it looks like.

Ajax paging

Normal

 

I just get idea to refresh all pages on ajax requests. Maybe it will work