![](/img/trans.png)
[英]Can you re-populate file inputs after failed form submission with PHP or JavaScript?
[英]Javascript/PHP re-populate dropdown on form submission fails
我使用的是javascript,基于如下所示的下拉选择加载不同的表单:
<select id = "opts" onchange = "showForm()">
<option value = "0">Select Option</option>
<option value = "1">Option 1</option>
<option value = "2">Option 2</option>
</select>
<div id = "f1" style="display:none">
<form name= "form1">
Content of Form 1
</form>
</div>
<div id = "f2" style="display:none">
<form name= "form2">
Content of Form 2
</form>
</div>
<script type = "text/javascript">
function showForm(){
var selopt = document.getElementById("opts").value;
if (selopt == 1) {
document.getElementById("f1").style.display="block";
document.getElementById("f2").style.display="none";
}
if (selopt == 2) {
document.getElementById("f2").style.display="block";
document.getElementById("f1").style.display="none";
}
}
</script>
我已经删除了实际的表单详细信息,因为此时它们并不重要。 无论如何,提交表单后,它将通过一系列验证:
if (isset($_POST['submitted'])) {
//validation codes
}
这很好用,但是如果验证失败,它将重新加载页面,从而重置下拉框,并且不显示先前选择的选项。 我希望它保留先前的选择,或者只是例如在提交失败时将选择1加载到javascript位中。 有任何想法吗?
伊恩
如果验证失败,您可以在javascript末尾执行此操作
window.onload = function(){
document.getElementById("opts").value = <?php echo $_POST['opts']; ?>;
}
用这个
window.onload=function() {
document.getElementById("opts").onchange=function() {
var selopt = this.value;
document.getElementById("f1").style.display=(selopt==1)?"block":"none";
document.getElementById("f2").style.display=(selopt==2)?"block":"none";
}
document.getElementById("opts").onchange(); // show/hide when reloaded
}
使用此PHP会将选择设置为提交时的选择
<? $sel = $_POST['opts']; ?>
<select name="opts" id ="opts">
<option value = "0"<? if ($sel==0) echo " selected ";?>>Select Option</option>
<option value = "1"<? if ($sel==1) echo " selected ";?>>Option 1</option>
<option value = "2"<? if ($sel==2) echo " selected ";?>>Option 2</option>
</select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.