Javascript 在php中表单提交后保留动态填充的select选项的值
我试图在提交表单后保留表单值Javascript 在php中表单提交后保留动态填充的select选项的值,javascript,php,jquery,html,Javascript,Php,Jquery,Html,我试图在提交表单后保留表单值 document.getElementById('start_date').value = "<?php echo $_POST['start_date'];?>"; document.getElementById('end_date').value = "<?php echo $_POST['end_date'];?>"; document.getElementById('start_date')。value=“”; document.g
document.getElementById('start_date').value = "<?php echo $_POST['start_date'];?>";
document.getElementById('end_date').value = "<?php echo $_POST['end_date'];?>";
document.getElementById('start_date')。value=“”;
document.getElementById('end_date')。value=“”;
它适用于日期选择器,但不适用于选择选项
HTML代码:
<form id=Inputs action="" method="POST" onsubmit="return ray.ajax()">
<center><table>
<td align="left" width=200px> <b>Select The Product:</b>
<select name="product" id="product" onChange="changecat(this.value);changeenv(this.value);">
<option value="" disabled selected>Select</option>
<option value="MOBILE">MOBILE</option>
<option value="RAM">RAM</option>
<option value="CAT">CAT</option>
</select></td>
<td width=200px> <b>Select Data Center:</b>
<select name="dc" id="dc">
<option value="" disabled selected>Select</option>
</select></td>
<td width=200px> <b>Select Environment:</b>
<select name="env" id="env"><option value='NO' selected disabled>Select</option>
</select></td>
<td width=200px> <b>Select Start Date:</b>
<input type="date" name="start_date" id="start_date">
</td>
<td width=200px><b>Select End Date:</b>
<input type="date" name="end_date" id="end_date"></td></tr></table></center><br>
<div align="center"><input type="submit" class="button" value="Submit" name="submit" onclick="clearBox('tb')"> <input type="reset" class="button" value="Reset" name="reset" onclick="clearBox('tb')"></div>
<br>
</form>
选择产品:
挑选
可移动的
内存
猫
选择数据中心:
挑选
选择环境:
挑选
选择开始日期:
选择结束日期:
动态填充选择下拉列表的JS代码:
<script language="javascript" type="text/javascript">
var mealsByCategory = {
MOBILE: ["Select","ALL","RED","GREEN"],
RAM:["Select","ALL","ROM","CPU"],
CAT:["Select","ALL","DOG","FOOD"],
}
function changecat(value) {
if (value.length == 0) document.getElementById("dc").innerHTML = "<option></option>" ;
else {
var catOptions = "";
for (categoryId in mealsByCategory[value]) {
catOptions += "<option>" + mealsByCategory[value][categoryId] + "</option>";
}
document.getElementById("dc").innerHTML = catOptions;
}
}
var environment = {
MOBILE: ["Select","Pr","Prv"],
RAM:["Select","Pr","Sl"],
CAT:["Select","Pr","BS"],
}
function changeenv(value) {
if (value.length == 0) document.getElementById("env").innerHTML = "<option></option>" ;
else {
var envOptions = "";
for (categoryId in environment[value]) {
envOptions += "<option>" + environment[value][categoryId] + "</option>";
}
document.getElementById("env").innerHTML = envOptions;
}
}
</script>
var mealsByCategory={
手机:[“选择”、“全部”、“红色”、“绿色”],
RAM:[“选择”、“全部”、“ROM”、“CPU”],
猫:[“选择”、“全部”、“狗”、“食物”],
}
功能更改CAT(值){
如果(value.length==0)document.getElementById(“dc”).innerHTML=“”;
否则{
var-catOptions=“”;
对于(mealsByCategory[值]中的categoryId){
catOptions+=“”+mealsByCategory[value][categoryId]+“”;
}
document.getElementById(“dc”).innerHTML=catOptions;
}
}
变量环境={
手机:[“选择”、“公关”、“公关”],
RAM:[“选择”、“Pr”、“Sl”],
类别:[“选择”、“Pr”、“BS”],
}
函数changeev(值){
如果(value.length==0)document.getElementById(“env”).innerHTML=“”;
否则{
var-envOptions=“”;
for(环境中的categoryId[值]){
环境选项+=“”+环境[值][类别ID]+“”;
}
document.getElementById(“env”).innerHTML=envOptions;
}
}
您的代码中有如下错误:
var environment = {
MOBILE: ["Select","Pr","Prv"],
RAM:["Select","Pr","Sl""], // Remove extra "
CAT:["Select","Pr","BS"],
}
签出此处放置-我已更改此处的值。document.getElementById('product')。value=“”;document.getElementById('dc')。value=“”;如果我这样做的话。在这种情况下,您只需要调用函数,例如
changecat(“”)
和其他函数