大家早上好。我有一个正在尝试解决的问题,但我陷入了困境,部分原因是我没有完全理解 JSP/Java 平台,也没有完全理解什么/如何以正确的方式实现我的代码。我确实有ASP背景,所以我对一些概念有点熟悉。
我遇到的问题是:我正在尝试填充动态标签和文本框以显示在网页(JSP)上。我已经成功地使用一段 JavaScript 代码填充文本框,但是,当我提交表单(在回发时)时,我的动态控件消失了,但所有静态控件仍然存在。我需要找到一种方法来将我的信息保持在提交时的动态控制中。当我有错误时,表单不会提交,但当表单完成渲染时,所有信息和动态文本都将丢失。
我的解决方案:我决定使用隐藏字段来保存此信息,但我无法在表单提交后触发隐藏字段:请看下面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
function validateForm(){
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="" && document.getElementById('two').value==1){
alert("EMPTY");
document.getElementById('text').style.display = "block";
return false;
}else{
document.myform.submit();
}
}
function display(el) {
if (el.value == "two") {
document.getElementById('text').style.display = "block";
}else {
document.getElementById('text').style.display = "none";
document.getElementById('dynbox').value = '';
}
}
</script>
</head>
<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
<label >First Name</label> <input type="text"/>
<div>
<input type="radio" name="radio1" id="one" value="one" onchange="display(this);"/>Eligible
</div>
<div>
<input type="radio" name="radio2" id="two" value="two" onchange="display(this);"/>Not Eligible
</div>
<div id="text" class="glassy" name="mytext" style="display:none;">Other: <input type="text" id="dynbox"/>
</div>
<div>
<input type="hidden" name="mytext" value="${mytext}" />
<br></br>
<input type="submit" onclick="validateForm()" value="Submit"/>
</div>
</form>
</body>
</html>
我想要做的是选择“不符合条件”选项并在文本框“mytext”中输入一些文本,然后按提交。一旦我按下提交,并且如果名字文本框未填写,那么我想触发我的隐藏文本框,这样我就不会在动态创建的文本框中丢失我的信息。
我希望这是有道理的。我不知道在 JSP 中该怎么做。有人可以指导如何获得预期结果吗?回发后保留动态控件吗?
提前致谢。
最佳答案
首先有一件事:不要让 Java
和 Java-Script
这两个名称让您感到困惑。他们(几乎)没有任何共同点。您在这里使用的只是 Java 脚本(没有 Java,任何地方都没有 JSP)。
无论如何,我认为这是您的 validateForm()
函数中的条件不起作用。
我对其进行了一些测试,它适用于这些更改:
您的表单
<form name="myForm" action="test.html" method="get" onsubmit="return validateForm();">
<label >First Name</label> <input type="text" id="firstName"/>
<div>
<input type="radio" name="radio1" id="one" value="one" onchange="display(this);"/>Eligible
</div>
<div>
<input type="radio" name="radio2" id="two" value="two" onchange="display(this);"/>Not Eligible
</div>
<div id="text" class="glassy" name="mytext" style="display:none;">Other: <input type="text" id="dynbox"/>
</div>
<div>
<input type="hidden" name="mytext" value="${mytext}" />
<br></br>
<input type="submit" value="Submit"/>
</div>
</form>
我只是更改了第一个输入并给了它一个 ID(因为我在任何地方都找不到 id“fname”),因此我们可以使用 JavaScript 访问它。
接下来是您的提交按钮。您还有一个额外的 onclick="validateForm()";
,它确实调用了 validateForm 函数,但不监听返回值(它执行该函数......仅此而已)。所以 onsubmit="return validateForm()"
就足够了。
您的验证函数
function validateForm() {
var x = document.getElementById('firstName').value;
if ((x == null || x == "")) {
alert("EMPTY");
// document.getElementById('text').style.display = "block";
return false;
} else {
return true;
}
}
x
现在可以通过元素的 id 进行检索(我发现这更容易)。无论如何,if 条件是问题之一。在表单中,将单选按钮“two”的值设置为 two
。但在 if 条件下,你会问是否可能是 1
...(以我的理解)这永远不应该发生。我刚刚删除它是为了向您展示您的函数是这样工作的。如果你想检查第二个单选按钮的状态,你可以这样测试:
if(document.getElementById('two').checked == true)
甚至更好
if(document.getElementById('two').checked)
最后一件事:在 else 语句中,您可以简单地返回 true
而不是调用 submit
.. 因为这里:
onsubmit="return validateForm();"
您要求 validateForm()
函数返回 true
然后提交,或者返回 false
然后停止提交。
哦,最后一件事(这是最后一件事, promise ):Java 和 JavaScript 按顺序处理所有 &&
和 ||
:第一个 ´x== null´ 将被测试,然后 x==""&& document.getElementById('two').value==1
将被一起评估(&& 具有比 || 更强的绑定(bind))..供您引用:)
关于java - 如何在回发后保留动态添加的控件? JavaScript、JSP,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23018796/