【问题标题】:jQuery validation plugin multiple formsjQuery验证插件多种形式
【发布时间】:2013-10-22 15:09:19
【问题描述】:

我正在尝试向一系列表单添加一些功能来验证两个复选框。我正在使用 jQuery 验证插件,我一生都无法让它工作。在小提琴中,当我提交它时,我只会收到一条 403 禁止消息。在我的实际网站上,它看起来甚至从未执行过。

HTML - 这些表单是多个且每页相同。 Stackoverflow 只让我展示一个

<form method="post" id="offer" name="offer" action="#" class="offer">
    <input type="text" name="original_description">
    <input type="text" name="description">
    <input type="text" name="added_by">
    <input type="submit" id="add" value="add" class="submit">
</form>

JS

$(".offer").each(function () {
    $(this).validate({
        submitHandler: function (form) {
            var x = form.find('input[name=description]').val();
            var y = form.find('input[name=original_description]').val();
            var z = similar_text(x, y, 1);
            alert("Description: " + x + " original_description: " + y + " z: " + z)
            if (z > 50 && !isNaN(z)) {
                alert("Description too similar to original. Please make it less similar");
                return false;
            }
            form.submit();
        },
        rules: {
            added_by: {
                required: true
            }
        },
        messages: {
            added_by: {
                required: 'Please select your name'
            }
        }
    });
});

【问题讨论】:

  • 有一个错字,导致您的脚本无法执行。就在“规则:”之前缺少一个“,”来分隔属性
  • @jbl 感谢添加了“,”并发现了另一个错字。但是仍然无法正常工作,仍然会从小提琴中得到 CSRF verification failed. Request aborted. 错误
  • 我不确定 jsfiddle 是否允许对自身进行发布请求。您现在应该尝试使用本地代码
  • 你应该操作一个 jquery 对象:见jsfiddle.net/PzKC4/55

标签: jquery forms jquery-validate


【解决方案1】:

如 cmets 中所述,您应该在 rules: 之前添加一个“,”,并在您的 submitHandler 中操作一个 jquery 表单对象,如下所示:

$(".offer").each(function () {
    $(this).validate({
        submitHandler: function (form) {
            var x = $(form).find('input[name=description]').val();
            var y = $(form).find('input[name=original_description]').val();
            var z = similar_text(x, y, 1);
            alert("Description: " + x + " original_description: " + y + " z: " + z)
            if (z > 50 && !isNaN(z)) {
                alert("Description too similar to original. Please make it less similar");
                return false;
            }
            form.submit();
        },
        rules: {
            added_by: {
                required: true
            }
        },
        messages: {
            added_by: {
                required: 'Please select your name'
            }
        }
    });
});

【讨论】:

    猜你喜欢
    • 2018-05-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-12-07
    • 2012-04-30
    • 1970-01-01
    • 2015-07-17
    • 1970-01-01
    相关资源
    最近更新 更多