[英]JavaScript validation - document.getElementById not working in Bootstrap modal
I am using an onSubmit()
function to validate form entries. 我正在使用onSubmit()
函数来验证表单条目。
The form and validation function work OK,if the form is in a standalone php file or an html file. 如果表单位于独立的php文件或html文件中,则表单和验证功能可以正常工作。
But when the form is embedded in a Bootstrap modal the JS validation function throws an error message. 但是,当表单嵌入到Bootstrap模态中时,JS验证功能将引发错误消息。 [object HTMLInputElement]
I have tried changing document.getElementById('uemail')
to document.getElementById('uemail').value
as recommended in another answer, but no value has apparently been passed to the function. 我尝试按照另一个答案中的建议将document.getElementById('uemail')
更改为document.getElementById('uemail').value
,但显然没有值传递给该函数。
If I remove the onSubmit()
attribute then the values are passed correctly to the action script on the server. 如果我删除onSubmit()
属性,那么值将正确传递到服务器上的操作脚本。
This must be common usage. 这必须是常见用法。 What am I doing wrong? 我究竟做错了什么?
This is an abbreviated section of my code: 这是我的代码的缩写部分:
<script>
function formCheck() {
var valid = true;
//alert('in function');
var email = document.getElementById('uemail');
alert('email:' + email);
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if (!filter.test(email)) {
alert('Please provide a valid email address');
email.focus;
valid = false;
}
return valid;
}
</script>
<form id="regform" action="action.php" method="post" onSubmit="return formCheck()">
Email: <input type="text" name="uemail" id="uemail" size="50" value="" required><span id ="ast">*</span><br>
<input type="submit" name="Submit" value="Register" />
</form>
EDIT: looks like you can't do document.getElementById
, you can do this instead: 编辑:看起来您无法执行document.getElementById
,您可以改为执行以下操作:
function formCheck(formEl) {
//...
var email = formEl.getElementsByTagName("input")[0].value;
// this will get the first input-element in your form
and 和
onsubmit="return formCheck(this)"
Mistake: The variable email
you are testing is a HTMLElement, not a string: 错误:您要测试的可变email
是HTMLElement,而不是字符串:
Solution: set email
to the value of the HTMLInputElement: 解决方案:将email
设置为HTMLInputElement的值:
var email = document.getElementById('uemail').value;
also email.focus;
也email.focus;
is not doing anything, use email.focus();
什么也没做,请使用email.focus();
Demo: 演示:
function formCheck() { var valid = true; //alert('in function'); var email = document.getElementById('uemail').value; alert('email:' + email); var filter = /^([a-zA-Z0-9_\\.\\-])+\\@(([a-zA-Z0-9\\-])+\\.)+([a-zA-Z0-9]{2,4})+$/; if (!filter.test(email)) { alert('Please provide a valid email address'); email.focus; valid = false; } return valid; }
<form id="regform" action="action.php" method="post" onsubmit="alert(formCheck())"> Email: <input type="text" name="uemail" id="uemail" size="50" value="" required><span id="ast">*</span> <br> <input type="submit" name="Submit" value="Register" /> </form>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.