我有三个带有动态选项表格DB的下拉框。当页面打开时,它们会将数据加载到所有三个下拉框。如果从Box-1中选择一个选项,Box-2,Box-3选项将根据Box-1上的选择进行更新/缩小。选择Box-2选项时将发生相同的操作。
但是当我提交表单时,Box-2和Box-3中的所有缩小选项都会被释放,并且所有选项都会在启动该页面时显示。请提供一些建议,以便在表单提交后保留我在box-2和box-3上的动态更新选项。
INDEX:
<?php
error_reporting(0);
include("config.php");
?>
<html>
<head>
<title>Search</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript" type="text/javascript">
function changeSecond(agm_branch){
var xmlhttp;
var designation = document.getElementById("designation").value;
var office = document.getElementById("office").value;
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){
var res=xmlhttp.responseText;
document.getElementById("designation").innerHTML=res;
}
}
xmlhttp.open("GET","second_script.php?first="+agm_branch+"&second="+designation+"&third="+office,true);
xmlhttp.send();
}
function changeThird(designation){
var xmlhttp;
var agm_branch = document.getElementById("agm_branch").value;
var office = document.getElementById("office").value;
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){
var res=xmlhttp.responseText;
document.getElementById("office").innerHTML=res;
}
}
xmlhttp.open("GET","third_script.php?first="+agm_branch+"&second="+designation+"&third="+office,true);
xmlhttp.send();
}
</script>
<style>
</style>
<link rel="stylesheet" href="css/style.css">
<script src="script.js"></script>
<style>
BODY, TD {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px;
}
</style>
</head>
<body>
<section class="register">
<h1> Contact Book Search</h1>
<div class="reg_section personal_info">
<form id="form1" name="form1" method="POST" action="">
<table width="1300" align="center" cellspacing="3" class="btable">
<tr>
<td width="179">NAME LOOKS LIKE:</td>
<td width="1100"><input type="text" name="lst_name" id="lst_name" value="<?php echo stripcslashes($_REQUEST["lst_name"]); ?>" /></td>
</tr>
<tr>
<td width="179" valign="middle"> AGM BRANCH: </td>
<td width="1100">
<select id="agm_branch" name="agm_branch" onChange="changeSecond(this.value)">
<option value="">--</option>
<?php
$sql = "SELECT * FROM ".$SETTINGS["data_table"]." GROUP BY agm_branch ORDER BY agm_branch";
$sql_result1 = mysql_query ($sql, $connection ) or die ('request "Could not execute SQL query" '.$sql);
while ($row = mysql_fetch_assoc($sql_result1)) {
echo "<option value='".$row["agm_branch"]."'".($row["agm_branch"]==$_REQUEST["agm_branch"] ? " selected" : "").">".$row["agm_branch"]."</option>";}
?>
</select>
</td>
</tr>
<tr>
<td width="179" valign="middle">DESIGNATION:</td>
<td width="1100">
<select id="designation" name="designation" onChange="changeThird(this.value)">
<option value="">--</option>
<?php
$sql = "SELECT * FROM ".$SETTINGS["data_table"]." GROUP BY designation ORDER BY designation";
$sql_result1 = mysql_query ($sql, $connection ) or die ('request "Could not execute SQL query" '.$sql);
while ($row = mysql_fetch_assoc($sql_result1)) {
echo "<option value='".$row["designation"]."'".($row["designation"]==$_REQUEST["designation"] ? " selected" : "").">".$row["designation"]."</option>";}
?>
</select>
</td>
</tr>
<tr>
<td width="179" valign="middle">OFFICE:</td>
<td width="1100">
<select id="office" name="office">
<option value="">--</option>
<?php
$sql = "SELECT * FROM ".$SETTINGS["data_table"]." GROUP BY office ORDER BY office";
$sql_result1 = mysql_query ($sql, $connection ) or die ('request "Could not execute SQL query" '.$sql);
while ($row = mysql_fetch_assoc($sql_result1)) {
echo "<option value='".$row["office"]."'".($row["office"]==$_REQUEST["office"] ? " selected" : "").">".$row["office"]."</option>";}
?>
</select>
</td>
<td><input type="submit" name="button" id="button" value="Filter" /></td>
<td>
</label><a href=""> reset</a>
</td>
</tr>
</table>
</form>
</section>
</div>
<table align="center" width="1300" border="1" cellspacing="1" cellpadding="3" class="btable">
<tr align="center" valign="middle">
<td width="130" bgcolor="#CCCCCC"><strong>Last Name</strong></td>
<td width="130" bgcolor="#CCCCCC"><strong>Calling Name</strong></td>
<td width="180" bgcolor="#CCCCCC"><strong>Designation</strong></td>
<td width="100" bgcolor="#CCCCCC"><strong>AGM Branch</strong></td>
<td width="220" bgcolor="#CCCCCC"><strong>DGM Branch</strong></td>
<td width="250" bgcolor="#CCCCCC"><strong>Office</strong></td>
</tr>
<?php
if ($_REQUEST["lst_name"]<>'') {$search_last_name = " AND (last_name LIKE '%".mysql_real_escape_string($_REQUEST["lst_name"])."%' OR calling_name LIKE '%".mysql_real_escape_string($_REQUEST["lst_name"])."%')";}
if ($_REQUEST["agm_branch"]<>'') {$search_agm_branch = " AND agm_branch='".mysql_real_escape_string($_REQUEST["agm_branch"])."'";}
if ($_REQUEST["designation"]<>'') {$search_designation = " AND designation='".mysql_real_escape_string($_REQUEST["designation"])."'";}
if ($_REQUEST["office"]<>'') {$search_office = " AND office='".mysql_real_escape_string($_REQUEST["office"])."'";}
if ($_REQUEST["lst_name"]<>''OR $_REQUEST["agm_branch"]<>''OR $_REQUEST["designation"]<>'' OR $_REQUEST["office"]<>'') {
$sql1 = "SELECT * FROM ".$SETTINGS["data_table"]." WHERE id>0".$search_last_name.$search_agm_branch.$search_designation.$search_office;
$sql_result = mysql_query ($sql1, $connection ) or die ('request "Could not execute SQL query" '.$sql1);}
if (mysql_num_rows($sql_result)>0)
{
while ($row = mysql_fetch_assoc($sql_result))
{
?>
<tr valign="middle">
<td><?php echo $row["last_name"]; ?></td>
<td><?php echo $row["calling_name"]; ?></td>
<td><?php echo $row["designation"]; ?></td>
<td><?php echo $row["agm_branch"]; ?></td>
<td><?php echo $row["dgm_branch"]; ?></td>
<td><?php echo $row["office"]; ?></td>
</tr>
<?php
}
}
else
{
?>
<tr valign="middle"><td colspan="6">No results found.</td></tr>
<?php
}
?>
</table>
</body>
</html>
second_script.php:
<?php
$first=$_GET["first"];
$second=$_GET["second"];
$third=$_GET["third"];
//echo $first;
$link = mysql_connect("localhost", "root", "");
if (!$link)
{
die('Could not connect: ' . mysql_error());
}
if (mysql_select_db("ahamed", $link)){
if ($first<>'') {$query1="SELECT * FROM data WHERE id>0 AND agm_branch='" .$first. "' GROUP BY designation ORDER BY designation";}
else {$query1= "SELECT * FROM data GROUP BY designation ORDER BY designation";}
$data1=mysql_query($query1);
?>
<select id="designation" name="designation">
<option value="">--<option>
<?php
while($row = mysql_fetch_assoc($data1))
{echo "<option value='".$row["designation"]."'".($row["designation"]==$second ? " selected" : "")."'>".$row["designation"]."</option>";}}
?>
</select>
third_script.php:
<?php
$first=$_GET["first"];
$second=$_GET["second"];
$third=$_GET["third"];
echo $first;
$link = mysql_connect("localhost", "root", "");
if (!$link)
{
die('Could not connect: ' . mysql_error());
}
if (mysql_select_db("ahamed", $link)){
if ($first<>'' && $second<>'') {$query= "SELECT * FROM data WHERE id>0 AND agm_branch='" .$first. "' AND designation='" .$second. "' GROUP BY office ORDER BY office";}
else if ($first<>'' && $second=='') {$query= "SELECT * FROM data WHERE id>0 AND agm_branch='" .$first. "' GROUP BY office ORDER BY office";}
else if ($first=='' && $second<>'') {$query= "SELECT * FROM data WHERE id>0 AND designation='" .$second. "' GROUP BY office ORDER BY office";}
else {$query= "SELECT * FROM data GROUP BY office ORDER BY office";}
$data = mysql_query($query);
?>
<select id="office" name="office">
<option value="">--<option>
<?php
while($row = mysql_fetch_assoc($data))
{echo "<option value='".$row["office"]."'>".$row["office"]."</option>";}}
?>
</select>
答案 0 :(得分:0)
实际上你正在使用两个ajax调用来获取数据
在您的情况下,对changeSecond函数中的两个脚本进行两次ajax调用,并使用相应脚本的结果更新div
不推荐使用像jquery这样的库,因为你可以用很少编码的方式轻松调用ajax