jQuery Validator-如何针对非格式项进行验证? [英] jQuery Validator - How to validate against non-form items?

问题描述

我有一个表单，用户可以在其中继续向列表添加项目.当他们提交此页面时，我想验证此列表中是否确实包含项目(而不是已经通过验证的单个项目).每个项目都被添加到表的新行中，TR的额外属性为"action" ...因此它看起来像:

I have a form where a user can keep adding items to a list. When they go to submit this page, I want to validate that this list actually has items in it (not the individual items as they've already been validated). Each item gets added to a new row in a table with the TR having an extra attribute of "action"... so it looks like:

<tr action="whatever">...</tr>

我试图做的是添加一个自定义的addMethod，该方法调用了一个函数，该函数将以动作作为属性的行数进行计数:

What I was attempting to do is add a custom addMethod that called a function which would count the number of rows with action as an attribute:

$("#tableID").find("tr[action]").length

，如果该长度大于0，则返回true，否则返回false.

and if that length is greater than 0, it returns true, otherwise, false.

在验证程序调用之外，此方法工作正常，但由于某些原因，它会完全跳过它.

This works fine outside of the validator calls but for some reason it completely skips over it.

即使不是特定的表单元素，我也可以真正使用一个示例或一些见解来使它验证此规则.

I could really use an example or some insight into how to make it validate this rule even though it is not a form element specifically.

按比例缩小代码:

* 请注意，我已经为邮件设置了默认设置，而没有设置默认设置.

$.validator.addMethod("validProductList", function (value, element) {
        return this.optional(element) || validateProductList();
    }, "You have no products in your list");

$("#processForm").click(function () {
        $("#pageForm").validate({
            submitHandler: function () {
                $("#errors").hide();
                //processPage();
            },
            rules: {
                //other rules,
                validProductList: true
            }
        });
    });

function validateProductList() {
    var isValid = false;
    var useList = $("#tblAddedProducts").find("tr[action]").length;
    if (useList > 0) { isValid = true; }
    return isValid;
}

推荐答案

之所以不起作用，是因为rules对象期望其子对象为表单字段名称(而不是规则名称).看来validate无法验证非form元素.但是，有一种方法可以解决此问题:

The reason this doesn't work is because the rules object expects its children to be form field names (not rule names). It looks like validate isn't capable of validating non-form elements. However, there's a way you can get around this:

1. 根据列表的状态将<input type='hidden' />添加到要更新的表单中.换句话说，每次添加或删除列表项时，都要设置该输入的值.这有一个明显的缺点.您的验证码现在分布在两个操作(添加和删除列表项)中.但是，我想您已经有处理添加/删除的代码，可以添加一个重新评估上述input状态的通用方法.

1. Add an <input type='hidden' /> to your form that you update depending on the state of the list. In other words, every time you add or remove a list item, set the value of that input. This has an obvious disadvantage; your validation code is now spread across two actions (adding and removing list items). However, I imagine you already have code that handles adding/removing, you could add a common method that re-evaluates the state of the aforementioned input.

使input成为必需，并正常使用.validate().

Make that input required and use .validate() normally.

这是一个非常粗糙的示例: http://jsfiddle.net/dT6Yd/

Here's a really rough working example: http://jsfiddle.net/dT6Yd/

如果您使用类似 knockoutjs 的框架，则可以使项目(1)更加容易一些.一个>.您可以告诉该框架观察"列表并自动更新输入，而不必跟踪它.

You can make item (1) a little easier if you use a framework like knockoutjs. You could tell that framework to "observe" your list and update the input automatically without you having to keep track of it.

这不是解决问题的最干净的方法，但是我以前已经看到过这样做，而且看来效果很好.

Not the cleanest way of handling the problem, but I've seen it done this way before and it seems to work well enough.

这篇关于jQuery Validator-如何针对非格式项进行验证?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！