Jquery validate在登录表单中始终为true

Jquery validate always true in a login form

本文关键字:true 表单 validate 登录 Jquery      更新时间:2023-09-26

我正在尝试用spring安全性实现一个简单的登录表单。但我想确保每次用户按下按钮时,只有在填写完所有内容后才能提交表格。

我使用来验证Jquery validate,问题是在按下按钮后,表单无论如何都会被提交(即使所有字段都是空的(。

我的JSP是:

<form id="loginuser" name="loginuser" action="<spring:url value="/j_spring_security_check" htmlEscape="true" />" method="POST"  class="login">  
    <div id="user_login">
        <fieldset>
            <dl>
                <input type='text' name='other_email' id='other_email'> 
                <dt><label for="j_username"><fmt:message key="app.username" />:</label></dt>
                <dd><input id="j_username" name="j_username" type="text" value="" tabindex="1" required/></dd>
                <dt><label for="j_password"><fmt:message key="app.password" />:</label></dt>
                <dd><input id="j_password" name="j_password" type="password" tabindex="2" required/></dd>               
            </dl>
        </fieldset>
        <p class="btn-paragraph">   
            <input type="submit" class="submitLoginButton btn-submit-style" value="<fmt:message key="app.login"/>" />
            <% // TODO: Quando a pagina de recovery password estiver concluida alterar o link para la!!  %>
            <a href="www.google.pt" class="help-link"><fmt:message key="login.recovery" /></a>
        </p> 
        <div id="loading" style="display:none;">
            <img id="loading-image" src="<c:url value="/resources/images/loader.gif"/>" alt="Loading..." />
        </div>
    </div>
</form>

我的Javascript代码是:

$(function() {
    $('#loginuser').validate({
        errorClass: 'errors',
        validClass: 'successes',
        onkeyup: false,
        rules: {            
            j_username: {
                minlength: minLength,
                loginUsernameRegex: true,
                required: true
            },
            j_password: {
                required: true,
                minlength: minLength
            }
        },
        messages: {
            j_username: {
                    minlength: '<fmt:message key="registeruser.username.minlength"/>',
                    required: '<fmt:message key="registeruser.username.required"/>',
                    loginUsernameRegex: '<fmt:message key="registeruser.username.alfanumeric.only"/>'
                }, 
            j_password:  {
                minlength: '<fmt:message key="registeruser.pwd.minlength"/>',
                required: '<fmt:message key="registeruser.pwd.required"/>'
            }
        },
        showErrors : function(errorMap, errorList) {
        this.defaultShowErrors();
        return false;
        }
    });
    $('.submitLoginButton').click(function(evt){
        if($('#other_email').val() && $('#other_email').val().length > 0){
            return false;
        }
        if($('#loginuser').valid()){
            console.log("Valid form");
        }
        else{console.log("not valid");}
        return false;
    });
});

所以每次我的控制台显示"有效表单"消息时。有人知道我在这里错过了什么??

谢谢!

我在jsfiddle中尝试了您的代码,它似乎可以工作。

但是,我认为应该为表单注册一个提交时处理程序,而不是为按钮注册一个点击时处理程序。

$('#loginuser').submit(function() {
    if ($('#other_email').val()) {
        return false;
    }
});

jsfiddle

尝试设置一个if语句来检查字段是否为空。if j_username == nil{do something};祝你好运!:D