我用这种方式制作了一个动态/连接选择的表单。
FORM HTML(index.php)
<form id="src_form" action="index.php" method="post">
<p>
<select name="catid_1" id="catid_1" class="fieldmax">
<?php echo $cs->show_cat_1(''); ?>
</select>
</p>
<p>
<select name="catid_2" id="catid_2" class="fieldmax">
<option value=""> </option>
</select>
</p>
<p>
<select name="catid_3" id="catid_3" class="fieldmax">
<option value=""> </option>
</select>
</p>
<p>
<input type="submit" name="submit" value="SRC" id="btn_src">
</p>
</form>
AJAX JS
$(function() {
// Ajax post Page
var urlpage = 'ajax-php/con-select.php';
// Vars
var wait = '<option value="">wait</option>';
var all = '<option value="">all</option>';
// Default
$("select#catid_2").prop("disabled", true);
$("select#catid_3").prop("disabled", true);
// CATID_1 Change
$("select#catid_1").change(function(){
// set var
var catid_1 = $("select#catid_1 option:selected").prop("value");
// laod
$("select#catid_2").html(wait);
$.post(urlpage,
{
catid_1:catid_1
},
function(data){
switch (data) {
case all:
$("select#catid_2").html("");
return false;
default:
$("select#catid_2").prop("disabled", false);
$("select#catid_2").html(data);
return false;
}
});
});
// CATID_2 Change ... etc
});
CON-SELECT.PHP
if(isset($_POST['catid_1']))
{
echo $cs->show_cat_2();
die;
}
if(isset($_POST['catid_2']));
{
echo $cs->show_cat_3();
die;
}
CLASS.PHP
public function show_cat_1()
{
$result = $this->db->mysqli->query
("SELECT * FROM cat_1 ORDER BY idcat_1 ASC");
$cat_1 = '<option value="">all</option>';
while($row = $result->fetch_assoc())
{
$cat_1 .= '<option value="' . $row['idcat_1'] . '"';
$cat_1 .= '>' . $row['idcat_1'] . '</option>';
}
return $cat_1;
}
public function show_cat_2()
{
$result = $this->db->mysqli->query
("SELECT * FROM cat_2 ORDER BY idcat_2 ASC");
$cat_2 = '<option value="">all</option>';
while($row = $result->fetch_assoc())
{
$cat_1 .= '<option value="' . $row['idcat_2'] . '"';
$cat_1 .= '>' . $row['idcat_2'] . '</option>';
}
return $cat_2;
}
etc..
我的目标是在提交表单(重新加载页面)后保留其选项(选择值),同时保持其功能。你能行的?我怎么能这样做?感谢