Question

我正在使用jQuery验证，它实际上有效，这意味着它显示错误并要求用户修复它们，但如果用户点击提交 - 它提交没有任何问题。有人可以帮帮我吗？代码示例如下：

<form class="col-lg-2 well" id="filterForm">
    <p><fmt:message key="name1"/></p>
    <input id="name" type="text" placeholder="name" value="${searchBean.name}" name="name" class="input-large text-primary">

    <p><fmt:message key="minimum.price"/></p><input id="minPrice" type="text" placeholder="minPrice" value="${searchBean.minPrice}" name="minPrice" class="input-large text-primary">

    <p><fmt:message key="maximum.price"/></p>
    <input id="maxPrice" type="text" placeholder="maxPrice" value="${searchBean.maxPrice}" name="maxPrice" class="input-large text-primary">

    <p><fmt:message key="manufacturer1"/></p>
    <input id="manufacturer" type="text" placeholder="manufacturer" value="${searchBean.manufacturer}" name="manufacturer" class="input-large text-primary">

    <p>
        <fmt:message key="categories"/>
        <c:forEach var="cat" items="${requestScope.categories}">
            <p><c:out value="${cat.second}"/></p>
            <input type="checkbox" name="category" value="<c:out value="${cat.first}"/>"/>
            </p>
        </c:forEach>

        <p><fmt:message key="sorts"/></p>
        <select name="sort">
            <option value="name"><fmt:message key="name"/></option>
            <option value="manufacturer"><fmt:message key="manufacturer"/></option>
            <option value="price"><fmt:message key="price"/></option>
        </select>

        <select name="sortType">
            <option value="ASC"><fmt:message key="asc"/></option>
            <option value="DESC"><fmt:message key="desc"/></option>
        </select>
    </p>

    <p><fmt:message key="pagesize"/>
        <input type="text" name="pageSize" id="pageSize" placeholder="pageSize" value="${searchBean.page.pageSize}">
    </p>

    <p><input type="submit" value="Filter" class="btn btn-primary"></p>
</form>

以下是验证功能：

$('#filterForm').validate(
    {
        rules: {
            name: {
                maxLength: 50,
                required: false
            },
            minPrice: {
                required: validatePrices() == true,
                min: 0,
                digits: true
            },
            maxPrice: {
                required: validatePrices() == true,
                min: 1,
                digits: true
            },
            manufacturer: {
                maxLength: 50,
                required: false
            },
            pageSize: {
                required: true,
                min: 0,
                number: true
            }
        },
        messages: {
            name: {
                maxLength:<fmt:message key="length.should.be.50.or.less"/>
            },
            minPrice: {
                min:<fmt:message key="min.length.is.1"/>,
                required:<fmt:message key="min.price.should.be.less.than.max"/>
            },
            manufacturer: {
                maxLength:<fmt:message key="length.should.be.50.or.less"/>
            },
            maxPrice: {
                min:<fmt:message key="min.length.is.1"/>,
                required: validatePrices() == true
            },
            pageSize: {
                min:<fmt:message key="min.length.is.1"/>
            }
        }
    }
)
});

寻求帮助。

Answer 1

只要存在验证错误，jQuery Validate插件就会阻止正常的表单提交。但是，您的代码存在一些可能会影响插件正常运行的潜在问题。

1）您的代码：

maxLength: 50,

没有名为maxLength的方法。 It is spelled maxlength

2）您的代码：

required: validatePrices() == true

这需要采用布尔值或函数。看起来应该更像......

required: function() {
    return validatePrices() == true;
}

3）您的代码：

required:<fmt:message key="min.price.should.be.less.than.max"/>

我不知道我是否应该自动知道这是您的原始服务器端代码。由于您只询问客户端代码，因此您只应在浏览器中将代码显示为呈现。在这种情况下，消息的定义应该更像......

required:  "min price should be less than max"

jQuery验证即使失败也提交非ajax

1 个答案: