Question

如何使用带有名称模式的id的jQuery插件验证表单，例如＃formNewHouse1，＃formNewHouse2，..？

此代码使用单一类型（普通）形式：

$("#formNewHouse").validate({
    rules: {
        formNewHouseName: {
            required: true
        },
        formNewHouseAddress: {
            required: true
        }
    },
    messages: {
        formNewHouseName: {
            required: "Please type a name"
        },
        formNewHouseAddress: {
            required: "Please type an address"
        }
    }
});

我需要这样的东西，其中X = 2,3,6,18,19，......（来自DB的ID）我该如何实现？

$("#formNewHouseX").validate({
    rules: {
        formNewHouseNameX: {
            required: true
        },
        formNewHouseAddressX: {
            required: true
        }
    },
    messages: {
        formNewHouseNameX: {
            required: "Please type a name"
        },
        formNewHouseAddressX: {
            required: "Please type an address"
        }
    }
});

提前致谢。

Answer 1

首先，通过一次通话验证所有表单。最后我检查过，jQuery Validate没有正确处理验证集合，所以你需要使用.each（或类似的）为每个表单创建一个新的验证器。

$("form[id^=formNewHouse]").each(function() { $(this).validate() });

然后，在您的字段中添加类，以便您可以选择它们并应用规则。

$('.newHouseName').rules('add', {required: true, messages: {required: 'Please type a name'}});
$('.newHouseAddress').rules('add', {required: true, messages: {required: 'Please type an address'}});

Answer 2

你最好使用类，但如果你需要使用id，你可以使用类似的东西

$("form[id^='formNewHouse']").validate({
    //...
});

这将选择id为以'formNewHouse'

开头的所有表单元素

Answer 3

我认为问题在于您的网页结构。我假设你有像

这样的东西

<form id="formNewHouse1">
    <input type="text" name="newHouseName1" />
    <input type="text" name="newHouseAddress1" />
</form>

<form id="formNewHouse2">
    <input type="text" name="newHouseName2" />
    <input type="text" name="newHouseAddress2" />
</form>

这会导致您调出每个输入以提供验证规则时遇到的问题。但我认为如果重构HTML，你可以很好地清理所有内容。您可以只为表单提供唯一的名称/ ID，但保持输入的名称相同。

<form id="formNewHouse1" class="formNewHouse">
    <input type="text" name="newHouseName" />
    <input type="text" name="newHouseAddress" />
</form>

<form id="formNewHouse2"  class="formNewHouse">
    <input type="text" name="newHouseName" />
    <input type="text" name="newHouseAddress" />
</form>

然后你可以像在帖子中一样调用你的验证，但是改为使用类。：

$(".formNewHouse").validate({
    rules: {
        formNewHouseName: {
            required: true
        },
        formNewHouseAddress: {
            required: true
        }
    },
    messages: {
        formNewHouseName: {
            required: "Please type a name"
        },
        formNewHouseAddress: {
            required: "Please type an address"
        }
    }
});

如果您正在动态生成输入名称，那么您将自己置于需要单独完成所有操作的位置。所以我希望这不是你正在做的事情。

如何在jQuery Validation Plugin中使用通配符？

3 个答案: