SitePoint Sponsor

User Tag List

Results 1 to 15 of 15

Thread: Ajax Refresh

Hybrid View

  1. #1
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Ajax Refresh

    Hey Girls & Boys,

    How do I add Ajax to the following PHP code so that when the "Next" & "Previous Screen" buttons don't navigate to a different page upon them being clicked, in order to view the next/previous 8 records?

    Code PHP:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="Index.css" />
    </head>
     
    <body scroll="no">
    <?php
    $con = mysql_connect("localhost","peter","abc123");
    if (!$con)
    {
      die('Could not connect: ' . mysql_error());
    }
     
    mysql_select_db("TS", $con);
     
    $perpage = 8;
     
    $start = (isset($_GET['id'])) ? $_GET['id'] : 0;
     
    $TotalRec = mysql_result(mysql_query("SELECT COUNT(*) FROM Buttons"), 0);
     
    $select = "SELECT * FROM Buttons LIMIT $start, $perpage";
    $result = mysql_query($select) or die(mysql_error());
     
    echo '<div id="Bar"></div>';
    echo '<div id="Container">';
     
    if($TotalRec==0)
    {
      echo "No Records Found, Please Add Some Records!";
    }
    else
    {
      # Dislay your rows here in the loop
      while($row = mysql_fetch_array($result))
      {
        echo '<div class="But">';
        echo   '<img id="ButImg" src="ButImg.bmp">';
        echo   '<div id="ButTitle">' . $row['Title'] . '</div>';
        echo   '<div id="ButBody">' . $row['Description'] . '</div>';
        echo   '<img id="But_tl" src="But_tl.gif">';
        echo   '<img id="But_tr" src="But_tr.gif">';
        echo   '<img id="But_bl" src="But_bl.gif">';
        echo   '<img id="But_br" src="But_br.gif">';
        echo '</div>';
      }
    }
    if($start == 0)
    {
      echo '<div id="ButPrevDis">';
      echo   '<div id="NavDis">Previous Screen</div>';
      echo '</div>';
    }
    else
    {
      echo '<div id="ButPrevEna">';
      echo   "<a href=\"./Display.php?id=" . ($start - $perpage) . "\" class=\"NavEna\">Previous Screen</a>";
      echo '</div>';
    }
     
    $page = ($_GET['id'] / $perpage) + 1;
    $total = ceil($TotalRec / $perpage);
     
    echo '<div id="Pag">';
    echo   '<div id="PagCap">' . "Screen " . $page . " of " . $total . '</div>';
    echo   '<img id="Pag_tl" src="Pag_tl.gif">';
    echo   '<img id="Pag_tr" src="Pag_tr.gif">';
    echo   '<img id="Pag_bl" src="Pag_bl.gif">';
    echo   '<img id="Pag_br" src="Pag_br.gif">';
    echo '</div>';
     
    if($start + $perpage >= $TotalRec)
    {
      echo '<div id="ButNextDis">';
      echo   '<div id="NavDis">Next Screen</div>';
      echo '</div>';
    }
    else
    {
      echo '<div id="ButNextEna">';
      echo   "<a href=\"./Display.php?id=" . ($start + $perpage) . "\" class=\"NavEna\">Next Screen</a>";
      echo '</div>';
     
    }
     
    echo '</div>';
    ?>
    </body>
    </html>

  2. #2
    SitePoint Evangelist bradical1379's Avatar
    Join Date
    Feb 2007
    Posts
    443
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Your AJAX will run on the client side of things, just making an asynchronous call to your server-side code.

    Check out the prototype AJAX library.

  3. #3
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Where do I go from there?

  4. #4
    SitePoint Evangelist bradical1379's Avatar
    Join Date
    Feb 2007
    Posts
    443
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Salchester View Post
    Where do I go from there?
    Getting a good grasp of searching and javascript.

    http://www.prototypejs.org/api/ajax/request

  5. #5
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How do I incorporate code from that page and put into my code?

  6. #6
    SitePoint Evangelist bradical1379's Avatar
    Join Date
    Feb 2007
    Posts
    443
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Salchester View Post
    How do I incorporate code from that page and put into my code?
    1. Download the prototype library
    2. create new AJAX function to call AJAX request in prototype library
    3. Include prototype.js and new ajax.js to your page
    4. Enjoy your ajaxified page.

  7. #7
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    You need to read the documents carefully and google for HTTPRequest also consider that not all users will have javascript enabled and so will not be able to navigate past the first page of results.
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  8. #8
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So Ajax is will that good then? is it best to stick to just PHP?

  9. #9
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    for something as important as pagination of results - I would
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  10. #10
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes but does it matter if the browsers navigates to a different page?
    Whats the advantage of using Ajax for this?

  11. #11
    SitePoint Evangelist bradical1379's Avatar
    Join Date
    Feb 2007
    Posts
    443
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Salchester View Post
    Yes but does it matter if the browsers navigates to a different page?
    Whats the advantage of using Ajax for this?
    If you are attempting to use AJAX because it's a current 'buzzword' in the Internet realm, you may want to re-evaluate the scenario you are attempting to place it in.

  12. #12
    Non-Member
    Join Date
    Jun 2007
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No! It's mainly because it allows you to retrieve information from the server without have to reload the page.

    Is that why your saying I should use it for pagination results?

  13. #13
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    No! Avoid using AJAX for important things like pagination! stick to PHP to handle the results.
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  14. #14
    SitePoint Evangelist bradical1379's Avatar
    Join Date
    Feb 2007
    Posts
    443
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by spikeZ View Post
    No! Avoid using AJAX for important things like pagination! stick to PHP to handle the results.
    Agreed.

    That way people can bookmark their resultset without having to run through 20 clicks to find it again.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •