我有一个带有两个空字段(密码,newPassword)和长度验证(7个字符),大写,小写,数字的表单。
我已经开发了测试,并且在激活验证时无法启用“重置密码”按钮。该按钮仍然处于锁定状态。
我认为错误可能出在isValid中,并且没有出现适当的参数。
我的JSP代码:
div class="form-group has-feedback">
<input class="form-control passwordField" type="password" name="newPassword" id="newPassword" autocomplete="off"
placeholder="<fmt:message key="es.sanitas.gid.enter.credentials.new.password.placehoder"/>"
required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"/>
<i class="material-icons md-18 form-control-feedback">lock</i>
</div>
<div id="passwordRules"></div>
<div class="form-group has-feedback" >
<input class="form-control passwordField" type="password" name="newPasswordConfirm" id="newPasswordConfirm" autocomplete="off"
placeholder="<fmt:message key="es.sanitas.gid.enter.credentials.confirm.password.placehoder"/>"
required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"/>
<i class="material-icons md-18 form-control-feedback">lock</i>
</div>
<div class="form-group">
<div>
<div id=confirm class="error" data-role="password-rule" >Las contraseñas deben coincidir</div>
<div id=length class="error" data-role="password-rule">La contraseña debe tener al menos 8 caracteres</div>
<div id=alphanumeric class="error" data-role="password-rule">Al menos se requiere 1 caracter alfanumérico</div>
<div id=numbers class="error" data-role="password-rule">Al menos se requiere 1 caracter numérico</div>
<div id=uppercase class="error" data-role="password-rule">Al menos se requiere 1 caracter en mayúsculas</div>
<div id=lowercase class="error" data-role="password-rule">Al menos se requiere 1 caracter en minúsculas</div>
</div>
</div>
<!-- <div class="form-group-btn"> -->
<div class="form-group">
<div class="loginBtn">
<input id="submit" type="submit" class="btn btn-primary btn-md btn-block btn-flat" value="<fmt:message key="es.sanitas.gid.restore"/>" disabled/>
</div>
</div>
我的JS代码:
$(document).ready(function() {
var filtros = [/[a-zA-Z0-9]/, /[A-Z]/, /[a-z]/, /\d/]
var tags = ['#alphanumeric', '#uppercase', '#lowercase', '#numbers']
var msgs = ["Al menos se requiere 1 caracter alfanumérico",
"Al menos se requiere 1 caracter en mayúsculas",
"Al menos se requiere 1 caracter en minúsculas",
"Al menos se requiere 1 caracter numérico"
]
var btn=0
var pswd=0
var conf=0
var minLength="La contraseña debe tener al menos 8 caracteres"
var pwdEquals="Las contraseñas deben coincidir"
$('#newPassword').keyup(function() {
pswd = $(this).val();
checkAllRules(pswd);
var isValid=checkAllRules(pswd);
if(isValid){
$("#submit").attr("disabled",false);
}
});
$('#newPasswordConfirm').keyup(function() {
conf = $(this).val();
checkEquals(pswd,conf);
});
function checkAllRules (pswd){
if (pswd.length > 7 ) {
pwdRuleOK('#length', minLength)
} else {
pwdRuleNOK('#length', minLength)
}
for (i = 0; i < filtros.length; i++) {
if (pswd.match(filtros[i])) {
pwdRuleOK(tags[i], msgs[i]);
} else {
pwdRuleNOK(tags[i], msgs[i]);
}
}
}
function pwdRuleOK(idTag, mensaje){
$(idTag).empty().removeClass("error").addClass("successCls").append('<i class="material-icons md-18 padding-6" style="">check_circle</i>'+mensaje);
}
function pwdRuleNOK(idTag, mensaje){
$(idTag).empty().removeClass("successCls").addClass("error").append(mensaje);
}