Need some AJAX help...

Discussion in 'JavaScript' started by LordXenu, Jan 9, 2011.

0
  1. #1
    So I have built a little search engine which scans my SQL databases. As opposed to having it reload a new page, I'd like to know how I could load my results ont he same page via AJAX. The following is the search.html and search.php code I use for displaying the search results now. How would I go about containing this and displaying the results in a single page, updating the results with AJAX?

    search.html
    
<html>
<body>

<form name="form" action="search.php" method="get">
  <input type="text" name="q" />
  <input type="submit" name="Submit" value="Search" />
</form>

</body>
</html>
    Code (markup):

    search.php
    
<?php

  $var = @$_GET['q'] ;
  $trimmed = trim($var);

$limit=10; 

mysql_connect("localhost","user","pass");

mysql_select_db("sql_database") or die("Unable to select database"); 

$query = "SELECT * FROM Users WHERE FirstName='$var' ORDER BY LastName DESC";

 $numresults=mysql_query($query);
 $numrows=mysql_num_rows($numresults);

echo "Results <br /><br />";
$count = 1 + $s ;

  while ($row= mysql_fetch_array($result)) {

  echo "$count.)&nbsp;" . $row["FirstName"] . " " . $row["LastName"] . "<br />" ;
  $count++ ;
  }

$currPage = (($s/$limit) + 1);

  echo "<br />";

  if ($s>=1) {
  $prevs=($s-$limit);
  print "&nbsp;<a href=\"$PHP_SELF?s=$prevs&q=$var\">&lt;&lt; 
  Prev 10</a>&nbsp&nbsp;";
  }

  $pages=intval($numrows/$limit);

 if ($numrows%$limit) {
  $pages++;
  }

  if (!((($s+$limit)/$limit)==$pages) && $pages!=1) {

  $news=$s+$limit;

  echo "&nbsp;<a href=\"$PHP_SELF?s=$news&q=$var\">Next 10 &gt;&gt;</a>";
  }

$a = $s + ($limit) ;
  if ($a > $numrows) { $a = $numrows ; }
  $b = $s + 1 ;
  echo "<p>Showing results $b to $a of $numrows</p>";
  
?>
    Code (markup):
     
    LordXenu, Jan 9, 2011 IP
  2. tvoodoo

    tvoodoo Active Member

    Messages:
    239
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    53
    #2
    tvoodoo, Jan 9, 2011 IP
  3. LordXenu

    LordXenu Active Member

    Messages:
    313
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    60
    #3
    LordXenu, Jan 9, 2011 IP
  4. Cash Nebula

    Cash Nebula Peon

    Messages:
    1,197
    Likes Received:
    67
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Cash Nebula, Jan 9, 2011 IP
  5. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #5
    Something like:
    
<form name="form" action="search.php" method="get">
  <input type="text" name="q" id="q" />
  <input type="submit" name="Submit" value="Search" id="btnSearch" />
</form>
<div id="results"></div>
<script type="text/javascript">
document.getElementById("btnSearch").onclick = function() {
    var q = document.getElementById("q").value;
    loadurl("search.php","&q=" + q,"results");
    return false;
}
function loadurl(url,query,divid) {
        if (window.XMLHttpRequest) xmlhttp=new XMLHttpRequest();
        else xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        
        xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        document.getElementById(divid).innerHTML=xmlhttp.responseText;
                    }
            }
        xmlhttp.open("GET",url + "?t=" + Math.random() + query,true);
        xmlhttp.send();
    }
</script>
    Code (markup):
     
    camjohnson95, Jan 13, 2011 IP
  6. wayons

    wayons Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Hi LordXenu,

    I can help you out in ajax . I have a set of ajax professionals. Let me know
     
    wayons, Jan 13, 2011 IP