时间戳

首页 > 解决方案 > 使用 jquery validate 插件验证最少人数最多人数字段

jquery - 使用 jquery validate 插件验证最少人数最多人数字段

问题描述

在我的表格中，我允许在文本框中输入最少人数和最多人数。我已经用 min 参数进行了验证，它应该是最小的 1。但是我怎样才能验证最小人数字段也应该小于最大人数，反之亦然。最小人数和最大人数也不应相同。任何人都可以帮助我如何做到这一点？提前致谢！

$("#frmCont").validate({
        rules:{
            name:{ required:true},
            min_persons:{ digits:true,min:1 },
            max_persons:{ digits:true,min:1 },
            duration:{ digits:true,min:1 },
            price_per_person:{ digits:true,min:1 }
        }

    });
});

标签： jqueryjquery-validate

解决方案

您将编写一个返回规则参数的函数，这使得它依赖于另一个字段的值或状态。

$("#frmCont").validate({
    rules: {
        min_persons: {
            required: function(element) {
                return $('[name="max_persons"]').is(':filled');
            },
            digits: true,
            min: 1
        },
        max_persons: {
            required: function(element) {
                return $('[name="min_persons"]').is(':filled');
            },
            digits: true,
            min: function(element) {
                return parseInt($('[name="min_persons"]').val()) + 1;
            }
        },
        ....

  1. 每个字段仅required在填写其他字段时才有效。

  2. min字段上的规则参数max_persons由字段的值决定min_persons。

  3. 这两个字段永远不可能相等，因为其中min一个字段的规则总是比另一个字段大一个数字。

工作演示： jsfiddle.net/vxtjbqod/

推荐阅读