[英]I am trying to validate jsp login form,I need field (label) validation instead of alert message
Here is my javascript: 这是我的JavaScript:
function checkEmail() {
var email = document.getElementById('mLoginName');
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})|([0-9]{10})+$/;
if (!filter.test(email.value)) {
alert("Please enter valid email id or 10 digit mobile number");
email.focus();
return false;
}
}
HTML Code: HTML代码:
<form:form method="post" onsubmit="return checkEmail();" action="SignIn" modelAttribute="memberBean" >
<form:input type='hidden' name='mode' id='mode' path='mode' />
<form:input type='text' class="input" name='mLoginName' id='mLoginName' path='mLoginName' onblur="checkInp()" placeholder='Email/Mobile' />
<input type='submit' class="submit" value='SignIn/SignUp' >
</form:form>
You can just add a <span id="mLoginValidate"></span>
( or a <p></p>
depending on how you want it to look ) after your input, and then in your code, add 您可以在输入后添加<span id="mLoginValidate"></span>
(或<p></p>
取决于您的外观),然后在代码中添加
document.getElementById('mLoginValidate').innerHTML = "Please enter valid email id or 10 digit mobile number";
You can also change its css to display: none
when the user starts re-typing, and then change it back do display: block
upon failed validation. 您还可以将其css更改为display: none
当用户开始重新键入内容时,不display: block
,然后再将其更改回display: block
在验证失败时display: block
。
Here's a little fiddle: https://jsfiddle.net/virginieLGB/h600vecx/ 这是一个小提琴: https : //jsfiddle.net/virginieLGB/h600vecx/
Here's what I've done: 这是我所做的:
HTML: HTML:
<input type='text' ... onkeydown="hideError()" />
<span id="mLoginValidate">Please enter valid email id or 10 digit mobile number</span>
CSS: CSS:
span {
color: red;
display: none;
}
JAVASCRIPT: JAVASCRIPT:
function hideError() {
document.getElementById("mLoginValidate").style.display = "none";
}
And in your checkEmail() function : 在您的checkEmail()函数中 :
document.getElementById("mLoginValidate").style.display = "block";
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.