Parsley 阻止提交输入验证

Question

我正在尝试使用 parsley 来验证包含在 DIV 结构中的不同数量的输入（订单行项目）（主要形式用于订单详细信息）。

因此，我将表单外的数据转换为 JSON 并注入隐藏字段。一切都很好（包括服务器端验证）。

我遇到的问题是，在提交表单时，验证通过，并根据需要显示错误，但表单在“失败”时继续通过提交过程。

有什么方法可以查看页面上是否存在任何错误并阻止页面提交继续？

这是不工作的：

$('#submit-form').on('click', function(e){
    e.preventDefault();

    // Validate line items
    $.each($('#lineItems').find('.input-group input'), function(i, val){
        $(val).parsley(parsleyConfig).validate();
    });

所有错误都会显示，但页面仍然会 POST。 但是，如果主窗体中的数据不好，提交时会弹出验证错误，这是由这个设置的：

// Validation
var parsleyConfig = {
    errorsContainer: function(pEle) {
        return pEle.$element.parent().siblings('.text-danger');
    }
};
$('#editForm').parsley(parsleyConfig);

我尝试过将'form:submit'事件与欧芹一起使用，但也没有运气......

    $('#editForm').parsley(parsleyConfig).on('form:submit', function(){
    // Validate line items
    $.each($('#lineItems').find('.input-group input'), function(i, val){
        $(val).parsley(parsleyConfig).validate();
    });
});

我似乎无法找到一种方法来获取验证是否通过并中止我的提交脚本的返回值...

Answer 1

在你的 'form:submit' 事件监听器中写下这段代码：

//the validate() calls the error validation and add the error messages:
if ($('#editForm').parsley().validate() == false) {
    //Do nothing:
    return;
}