I have created a simple text input box that will be used to fetch data from a databse using ajax.
<form method="post" action="">
<input type="text" id="txt1" onkeyup="showHint(this.value);" />
</form>
The textbox calls an ajax function called showHint(str) in my ajax.js file as follows:
function showHint(str){
var xmlhttp;
if (str.length==0)
{
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("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","index.php?page=getList&q="+str,true);
xmlhttp.send();
}
As you can tell from the above script it opens my PHP script that is used to fetch details from the databse like so:
//get the q parameter from URL
$q = $_GET["q"];
$sql = "SELECT Name FROM Country WHERE Name LIKE '" . $q . "%'";
$recordSet = $_dbConn->query($sql);
$a = $recordSet->getrow();
//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}
// Set output to "no suggestion" if no hint were found
// or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//output the response
echo $response;
The issue is that I am using a single Index.php page and so this line: "index.php?page=getList&q="+ is kinda like saying www.mydomain.com/index.php?index.php?page=getLet$q.
how can i fix this? I have tried to use POST and still not working. i have also tried to erase the index.php part in JS and that wont work either... thank you