Tweet
Hi everyone,
I hope someone can understant me, coz I'm so confused because of this code.
I need to write a code that have 2 dropdown menus and 2 input fields , all of these are depend on each other. once u select one from the first menu the related things in DB will display in the 2nd menu.Right now I do it well by ajax script and php but when I try to complete to make input field depend on the the 2nd menu , it doesn't work by many ways every time double P.O box field is displayed .. this is the main page code
and this is were the support file state.php
the question is according to the code .. how can I make an input field that is depend on the previous choice of menus?? if I want the validation is made on the same page before submitting ..
thanks for all.
I hope someone can understant me, coz I'm so confused because of this code.
I need to write a code that have 2 dropdown menus and 2 input fields , all of these are depend on each other. once u select one from the first menu the related things in DB will display in the 2nd menu.Right now I do it well by ajax script and php but when I try to complete to make input field depend on the the 2nd menu , it doesn't work by many ways every time double P.O box field is displayed .. this is the main page code
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Traditional Addresses</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- start header -->
<div id="topbg"> </div>
<div id="header"> </div>
<!-- end header -->
<!-- start page -->
<div id="page">
<div class="bgtop">
<div class="bgbtm">
<!-- start content -->
<div id="content">
<div class="post">
<h1 class="title">Traditional Address</h1>
<form name="sel" >
<div>
<h3>Choose The Appropraite Information :</h3>
<br />
</div>
<div>
<table id="tab">
<tr>
<td>City : </td>
<td> <font id=cities> <select ><option value="0">Choose one ...</option></select></font></td>
</tr>
<tr>
<td>Post Offic Or (Zip Code) : </td>
<td> <font id=post_office><select><option value="0">Choose one ...</option></select></font></td>
</tr>
<script language=Javascript>
function Inint_AJAX() {
try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE
try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript
alert("XMLHttpRequest not supported");
return null;
};
function dochange(src, val) {
var req = Inint_AJAX();
req.onreadystatechange = function () {
if (req.readyState==4) {
if (req.status==200) {
document.getElementById(src).innerHTML=req.responseText; //retuen value
}
}
};
req.open("GET", "state.php?data="+src+"&val="+val); //make connection
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=iso-8859-1"); // set Header
req.send(null); //send value
}
window.onLoad=dochange('cities', -1); // value in first dropdown
</script>
<tr>
<td>P.O.Box : </td>
<td> <input align=middle type="text" name="p.o.box" value="" size="30"/></td>
</tr>
<tr>
<td>Enter the owner name (Optional): </td>
<td> <input align=middle type="text" name="owner_name" value="" size="30"/></td>
</tr>
<tr>
<td><br /></td>
</tr>
<tr>
<td> <input value="Save And Back" name="SaveAndBack" type="button" style="background-color: #D3D3D3" /></td>
<td> <input value="OK" name="OK" type="button" style="background-color: #D3D3D3" /></td>
</tr>
</table>
</form>
</div>
</div>
</div>
<!-- end content -->
<!-- start sidebar -->
<div id="sidebar">
<ul>
<li>
<h2><b>Site Language</b></h2>
<ul>
<li><a href="#">English</a></li>
<li><a href="#">عربي</a></li>
</ul>
</li>
</ul>
</div>
<!-- end sidebar -->
<div style="clear:both"> </div>
</div>
</div>
</div>
<div id="footer">
<p> <a href="index.html">Home</a> • <a href="wasel_address.html">Wasel
Addresses</a> • <a href="traditional_address.html">Traditional Addresses</a> • <a href="service_search.html">Service
Search</a></p>
</div>
<div style="clear:both"> </div>
</body>
</html>
Code:
<?
//set IE read from page only not read from cache
header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header ("Cache-Control: no-cache, must-revalidate");
header ("Pragma: no-cache");
header("content-type: application/x-javascript; charset=tis-620");
$data=$_GET['data'];
$val=$_GET['val'];
//set database
$dbhost = "localhost";
$dbuser = "root";
$dbpass = "";
$dbname = "post_db";
mysql_pconnect($dbhost,$dbuser,$dbpass) or die ("Unable to connect to MySQL server");
if ($data=='cities') { // first dropdown
echo "<select name='cities' onChange=\"dochange('post_office', this.value)\">\n";
echo "<option value='0'>==== choose one ====</option>\n";
$result=mysql_db_query($dbname,"select `city_id`, `city_name` from cities order by `city_id`");
while(list($id, $name)=mysql_fetch_array($result)){
echo "<option value=\"$id\" >$name</option> \n" ;
}
} else if ($data=='post_office') { // second dropdown
echo "<select name='post_office' >\n";
echo "<option value='0'>====choose one ====</option>\n";
$val2=$val;
$val = substr($val,0,2);
$result=mysql_db_query($dbname,"SELECT `city_id`, `post_office` FROM traditional_add WHERE `city_id` = '$val2' ");
while(list($id, $name)=mysql_fetch_array($result)){
echo "<option value=\"$id\" >$name</option> \n" ;
}
}
echo "</select>\n";
?>
the question is according to the code .. how can I make an input field that is depend on the previous choice of menus?? if I want the validation is made on the same page before submitting ..
thanks for all.
Comment