Dear prog wizards,
Please help as I am noob at this. I got source code from other website in which I made small changes to cater my need. I have created a database called 'a_database' and table called 'property' using XAMPP 1.7.7 . The columns are 'id', 'Type', 'Price' and 'Location'.
My first dropdown box filters Type
My second dropdown box filters Location
For example : Type is House and Factory
Location is Bangkok and Singapore
When I select House, I will get the desired table.
Then, I select Bangkok and expect to filter House which are located in Bangkok. Unfortunately, this did not happen. Can someone please help me on this ?
My ajax code :
<html> <head>
<script type="text/javascript">
function showtype(str){
var ajaxRequest; // The variable that makes <strong class="highlight">Ajax</strong> possible!
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('txtHint');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
ajaxRequest.open("GET","gettype.php?q="+str,true);
ajaxRequest.send(null);
}
function showlocation(str){
var ajaxRequest; // The variable that makes <strong class="highlight">Ajax</strong> possible!
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('txtHint');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
ajaxRequest.open("GET","getlocation.php?q="+str,true);
ajaxRequest.send(null);
}
//-->
</script>
</head>
<body>
<form>
<select name="type" onchange="showtype(this.value)">
<option value="">Select property type:</option>
<option value="1">All</option>
<option value="2">factory</option>
<option value="3">house</option>
</select><br />
<select name="Location" onchange="showlocation(this.value)">
<option value="">Select property location:</option>
<option value="1">All</option>
<option value="2">bangkok</option>
<option value="3">Patpong</option>
</select> </form> <br />
<div id="txtHint"><b>Person info will be listed here.</b></div> </body> </html>
My getlocation.php
<?php
$q=$_GET["q"];
// check for your q values, 1 = all, 2 = bangkok, 3 = Patpong
$con = mysql_connect('localhost', 'root', '');
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("a_database", $con);
// based on the value passed in we may have to change query, if all run this...
if ($q == 1) {
$sql="SELECT * FROM property";
} else if($q == 2){
$sql="SELECT * FROM property WHERE Location = 'bangkok'";
} else if($q == 3){
$sql="SELECT * FROM property WHERE Location = 'Patpong'";
}
$result = mysql_query($sql);
echo "<table border='1'> <tr> <th>Type</th> <th>Price</th> <th>Location</th> </tr>";
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['Type'] . "</td>";
echo "<td>" . $row['Price'] . "</td>";
echo "<td>" . $row['Location'] . "</td>";
echo "</tr>"; }
echo "</table>";
mysql_close($con);
?>
My gettype.php
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', '');
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("a_database", $con);
if ($q == 1) {
$sql="SELECT * FROM property";
} else if($q == 2){
$sql="SELECT * FROM property WHERE Type = 'factory'";
} else if($q == 3){
$sql="SELECT * FROM property WHERE Type = 'house'";
}
$result = mysql_query($sql);
echo "<table border='1'> <tr> <th>Type</th> <th>Price</th> <th>Location</th> </tr>";
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['Type'] . "</td>";
echo "<td>" . $row['Price'] . "</td>";
echo "<td>" . $row['Location'] . "</td>";
echo "</tr>"; }
echo "</table>";
mysql_close($con);
?>