Retrieve database with ajax
I'm using this example to retrieve database results with ajax, and its working great.
Now instead of just using one drop down box to retrieve database results I would like to add an input box as well. The results should not be displayed after the user chooses a value from the drop down box, the user needs to insert a value on the input box aswell for the result to be displayed. The result should be based on the drop down box TOGETHER with the value inserted on the input box.
You can see the php file on the example above where the sql request looks like this:
$q=$_GET["q"];
$sql="SELECT * FROM user WHERE id = '".$q."'";
I'm thinking that maybe the new sql request should look something like this:
$q=$_GET["q"];
$q=$_GET["d"];
$sql="开发者_运维百科;SELECT * FROM user WHERE id = '".$q."' AND date = '".$d."'";
where $d represents the value from the input box.
Is this possible?
Thanks in advance.
1) W3Schools examples are using absolutely terrible PHP code. For example, you copy pasted that code there and you'd probably continue using it without even noticing that it's extremely prone to SQL Injection Attacks. Always clean user input, always. Otherwise, don't be alarmed when you see your database and data are gone.
2) Word 'date' is a reserved word in MySQL's dictionary. It's used to specify the data type of a column or to format a date expression for use in the query. Don't use reserved words for your column names, you'll most likely encounter an error and you'll be wondering what's going on with your code that looks ok.
3) Always test your SQL in a GUI (SQLYog is my favorite) to check whether it works and if you can break it somehow based on input.
Otherwise - yes, do try your own suggestion, trial and error is the best way to learn because it'll stick with you forever.
Absolutely, you just need to add variables to the ajax call:
<html>
<head>
<script type="text/javascript">
function showUser()
{
str=document.getElementById("users").value;
txt=document.getElementById("txtinput").value;
if (str==""||txt=="")
{
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","getuser.php?q="+str+"&d="+txt,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select id="users" name="users" onchange="showUser()">
<option value="">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
<option value="3">Glenn Quagmire</option>
<option value="4">Joseph Swanson</option>
</select>
<input type="text" id="txtinput" onchange="showUser()"/>
</form>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
</html>
加载中,请稍侯......
精彩评论