2

我正在使用 jQuery validate ，它确实有效，这意味着它会显示错误并要求用户修复它们，但如果用户单击提交 - 它会毫无问题地提交。有人可以帮帮我吗 ？代码示例如下：

<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"/>
            }
        }
    }
)
});

谢谢帮助。

4

1 回答 1

0

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

1） 您的代码：

maxLength: 50,

没有这种方法称为maxLength. 它是拼写的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"
于 2013-11-13T17:10:35.727 回答