Ajax: Enter "shirt" and only "shir" has been passed - why?

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Ajax: Enter "shirt" and only "shir" has been passed - why?

Post by simonmlewis »

I use Ajax to do a pre-search (like you see on so many sites, including Facebook's search for people at the top.

So as I enter "shirt", shirts begin to appear.

The problem is, it's finding things that are not related to the search, and the reason is, because what I have entered, it's not passed thru immediately.

Enter "shi"..... and the variable is only store the previous storage of "sh", so if I then do "shir", it's just showing "shi".

Here is my *.php file tha Ajax posts to:

Code: Select all

<?php
$q=$_GET["q"];
include "dbconn.php";
$result = mysql_query ("SELECT id, photothumb, price, title, category, catid FROM products WHERE (title LIKE '%$q%' OR description LIKE '%$q%') AND pause = 'off'")or die(mysql_error());
$num_rows = mysql_num_rows($result); 
echo "<div class='presearchbox'>";
while ($row = mysql_fetch_object($result)){
 $title = "$row->title"; 
 $findtitle ="/ /"; 
 $replacetitle ="-"; 
 $titlereplace = preg_replace ($findtitle, $replacetitle, $title); 
 
 $categ = "$row->category"; 
 $findcateg ="/ /"; 
 $replacecateg ="-"; 
 $categreplace = preg_replace ($findcateg, $replacecateg, $categ); 
 
echo "<table class='table' cellpadding='0' cellspacing='0' style='color: #ffffff' width='253px'>

<tr bgcolor='#000000' onMouseOver=\"this.bgColor='#ff0000';\" onMouseOut=\"this.bgColor='#000000';\">
      <td width='80px'>$q<a href='/product/$row->catid/$categreplace/$row->id/$titlereplace'>";
if ($row->photothumb == NULL)
{ echo "<img src='/images/blank.gif' height='60px' style='margin-right: 10px' border='0'/>";}
else { echo "
<img src='/images/productphotos/small/$row->photothumb' height='60px' style='margin-right: 10px' border='0'/>";}

echo "</a></td><td>

<b><a href='/product/$row->catid/$categreplace/$row->id/$titlereplace' style='text-decoration: none'>$row->title</b><br/>$row->category<br/>&pound;";
printf ("%.2f", $row->price);    
echo "</a></td></tr><tr><td colspan='2'><hr noshade size='1' color='#000000' /></td></tr></table>
";
} mysql_free_result($result);
echo "</div>";
mysql_close($sqlconn);
?>
And here is the PHP code at the top of the index file where you type in the box:

Code: Select all

<script>
function precheck(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("srcHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","/presearch.php?q="+str,true);
xmlhttp.send();
}
</script>
Why would it only use the previous entry, and not "as you type"?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by Celauran »

What event triggers the AJAX call?
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by simonmlewis »

As far as I know...

xmlhttp.open("GET","/presearch.php?q="+str,true);
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by Celauran »

No. In #txtHint, some event triggers the JS function call.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by simonmlewis »

Sorry I have no idea what you are saying. I'm not an Ajax expert by any means.
I'm just confused why it stores only the character entered 'before' rather than current.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by Celauran »

It's not storing anything, it's reading the value of the #txtHint field when the JS event fires. If the AJAX call is triggered by onkeypress or onkeydown, try changing it to onkeyup.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Ajax: Enter "shirt" and only "shir" has been passed - wh

Post by simonmlewis »

B-E-A-U-T-I-F-U-L.

Thanks Celauran.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
Post Reply