45
I am new in php and ajax, i am facing the prob while i click on element of first drop down then in second dropdown all element showl come from database.
I mean i have three dropdown 1. category which comes from database 2. brand which comes from databse according to content of first dropdown . and 3. price which is static.
when i am doing these things without ajax on every onChange() thw whole page is refreshing that i do not want. and with ajax i am facing some prob like i have two php pages in one page all drop down is written and in socond php page only brand' s drop down is written i mean when i ma calling any category from databse then in brand dropdown category comes from database but suppose i am choosing a COPUTER then computer related brand comes from databse and replace the existing drop down . i do not want to replace the drop down i want to clear the content of first page dropdown and populate the content which comes from second page.
here is code:
selectbrand.js
Expand|Select|Wrap|Line Numbers
- var xmlHttp
- function showBrand(str)
- {
- xmlHttp=GetXmlHttpObject()
- if (xmlHttp==null)
- {
- alert ("Browser does not support HTTP Request")
- return
- }
- var url="search2.php"
- url=url+"?id="+str
- url=url+"&sid="+Math.random()
- xmlHttp.onreadystatechange=stateChanged
- xmlHttp.open("GET",url,true)
- xmlHttp.send(null)
- }
- function stateChanged()
- {
- if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
- {
- document.getElementById("txtHint").innerHTML=xmlHttp.responseText
- }
- }
- function GetXmlHttpObject()
- {
- var xmlHttp=null;
- try
- {
- // Firefox, Opera 8.0+, Safari
- xmlHttp=new XMLHttpRequest();
- }
- catch (e)
- {
- //Internet Explorer
- try
- {
- xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
- }
- catch (e)
- {
- xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
- }
- }
- return xmlHttp;
- return true;
- }
search1.php
[PHP]<html>
<head>
<script src="selectbrand.js"></script>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>MB Solution Wikki</title>
<link rel="stylesheet" href="css_search.css" title="wikki">
</head>
<body>
<table cellpadding="0" cellspacing="0" width="100%">
<tbody><tr><td align="center">
<table style="margin-top: 1em; width: 80%;" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td align="left">
<div class="outer-box">
<div class="qbuilder-env" style=""></div>
<form method="get" name="f">
<div style="width: 100%;">
<h3>Find Article that have...</h3>
<input name="hl" value="en" type="hidden"><table cellpadding="2" cellspacing="0" width="100%">
<tbody>
<tr>
<td class="label">Keyword</td>
<td class="input"><input type="text" name="key" id="key" size="55"><td>
<td class="tip"> </td>
</tr>
<tr>
<td class="label"><label>Category:</label></td>
<td class="input">
<select name="cat" id="cat" onChange="showBrand(this.value)">
<option value="0" >Select</option>
<?
$conn = mysql_connect("localhost", "root", "");
$db = mysql_select_db("gadget");
$result = mysql_query("select id, name from `category` GROUP BY name");
$i = 0;
while($rows = mysql_fetch_array($result))
{
$val[$i] = $rows['id'];
if($id == $val[$i]) $selected = "selected = 'selected'"; else $selected = "";
print "<option value='".$val[$i]."' ".$selected.">".$rows['name']."</option>";
$i++;
}
?>
</select> </td>
<input name="h2" type="hidden" value="" id="h2">
<td class="tip"> </td></tr>
<tr>
<td class="label">
<label>Brand Name:</label></td>
<td class="input">
<div id="txtHint"> <select name="bname" size="1" id="bname">
<option value="0">Select</option>
<?
if($id == 0)
{
$results = mysql_query("select prod_name from `products` GROUP BY prod_name");
while($row = mysql_fetch_array($results))
{
//echo $row['prod_name'];
print "<option value='".$row['prod_name']."'>".$row['prod_name']."</option>";
}
}
else
{
$results = mysql_query("select prod_name from products where cat_id = '".$id."'");
while($row = mysql_fetch_array($results))
{
print "<option value='".$row['prod_name']."'>".$row['prod_name']."</option>";
}
}
?>
</select> </div> </td>
<td class="tip"> </td></tr>
<tr>
<td class="label"><label>Price Range :</label></td>
<td id="or-cell" class="input">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="33%"> <select name="range">
<option value="0" selected>Select</option>
<option value="1000 - 2000">1000-2000</option>
<option value="2000 - 4000">2000-4000</option>
<option value="4000 - 10000">4000-10000</option>
<option value="10000 - 15000">10000-15000</option>
<option value="15000 - eof">15000 and above</option>
</select> </td>
</tr></tbody></table>
<input name="as_oq" value="" type="hidden"> </td>
<td class="tip"> </td></tr></tbody></table>
<h3 align="right" style="margin-top: 1em;">
<label>
<?
$range = $_REQUEST['range'];
$range = trim($range);
$range1 = explode(" ",$range);
?>
<input type="submit" name="search" value="Search" id="search">
</label>
</h3></div>
<?php
if(isset($_REQUEST['search']))
{
if($_REQUEST['cat'] == 0 && $range1[2] != "eof")
{
$qry = "SELECT prod_descr, prod_img, name, prod_name, prod_price_gross from (SELECT * FROM `category` JOIN `products` ON category.id = products.cat_id) as cp WHERE cp.prod_name = '".$_REQUEST['bname']."' AND cp.prod_price_gross BETWEEN ".$range1[0]." and ".$range1[2]."";
}
elseif($_REQUEST['cat'] == 0 && $range1[2] == "eof")
{
$qry = "SELECT prod_descr, prod_img, name, prod_name, prod_price_gross from (SELECT * FROM `category` JOIN `products` ON category.id = products.cat_id) as cp WHERE cp.prod_name = '".$_REQUEST['bname']."' AND cp.prod_price_gross >= ".$range1[0];
}
elseif($range1[2] != "eof")
{
$qry = "SELECT prod_descr, prod_img, name, prod_name, prod_price_gross from (SELECT * FROM `category` JOIN `products` ON category.id = products.cat_id) as cp WHERE cp.id = '".$_REQUEST['cat']."' AND cp.prod_name = '".$_REQUEST['sel']."' AND cp.prod_price_gross BETWEEN ".$range1[0]." and ".$range1[2]."";
}
else
{
$qry = "SELECT prod_descr, prod_img, name, prod_name, prod_price_gross from (SELECT * FROM `category` JOIN `products` ON category.id = products.cat_id) as cp WHERE cp.id = '".$_REQUEST['cat']."' AND cp.prod_name = '".$_REQUEST['sel']."' AND cp.prod_price_gross >= ".$range1[0];
}
$search = mysql_query($qry) or die($qry);
while($show = mysql_fetch_array($search))
{
echo "<table width='100' border='0'>";
echo "<tr>";
echo '<td height="58"><table width="100" height="100" border="0">';
echo "<tr>";
echo '<td height="79">';
print "<img src=' ".$show['prod_img']." ' align='center' width='100' hieght='100' border='0'>";
echo "</td>";
echo "</tr>";
echo "</table>";
echo "</td>";
echo '<td valign="top">';
echo '<table width="200" border="0">';
echo "<tr>";
echo "<td><b>Category:</b> ";
print $show['name'];
echo '</td>';
echo '</tr>';
echo '<tr>';
echo '<td height="31"><b>Product Name:</b> ';
print $show['prod_name'];
echo "</td>";
echo "</tr>";
echo '<tr>';
echo '<td height="31"><b>Price:</b> ';
print $show['prod_price_gross'];
echo "</td>";
echo "</tr>";
echo '<tr>';
echo '<td height="31"><b>Description:</b> ';
print $show['prod_descr'];
echo "</td>";
echo "</tr>";
echo "</table>";
echo "</td>";
echo "</tr>";
echo "</table>";
}
}
?>
</div>
</form>
</div></td>
</tr></tbody></table></td></tr></tbody>
</table> </body></html>
[/PHP]
and scond php page is ;;
search2.php
[PHP] <?php
$id=$_REQUEST["id"];
//echo $id;
$con = mysql_connect('localhost', 'root', '');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("gadget", $con);
//echo "Select Brand:";
echo '<select name="sel" id="sel" size="1">';
echo '<option value="0">Select</option>';
//$row = mysql_fetch_array($result);
if($id == "0")
{
$results = mysql_query("select prod_name from `products` GROUP BY prod_name");
while($row = mysql_fetch_array($results))
{
//echo $row['prod_name'];
echo "<option value='".$row['prod_name']."'>".$row['prod_name']."</option>";
}
}
else
{
$results = mysql_query("select prod_name from `products` where cat_id = '".$id."'");
while($row = mysql_fetch_array($results))
{
echo "<option value='".$row['prod_name']."'>".$row['prod_name']."</option>";
}
}
echo "</select";
mysql_close($con);
?>[/PHP]
