重新启用字段后使用欧芹验证

时间:2013-09-12 15:11:23

标签: html forms validation parsley.js

我正在处理一个有两页的表单,技术上是1页,只是隐藏第二页直到第一页完成。我的第一个任务是能够使用parsley.js“验证”第一页,而不包括第二页中的元素。我这样做了 禁用(通过attr)第二页上的元素。因此,当单击“下一步”按钮时,仅将第一项中的项目保留为有效。 这很好用!,不幸的是在第二页上,在我从元素中删除了一个('禁用')之后,欧芹忽略它们并且仍然只验证第一页,因此返回“true”并提交页面而不检查第二页中的任何元素

感谢阅读!

1 个答案:

答案 0 :(得分:6)

好的,所以我想出来这是为了以后有人遇到这个。

在我加载第二页后,我销毁了欧芹,然后在重新启用元素后重新添加。

$('.new-account #page1 #next').on('click', function (e) {
    e.preventDefault(); 
    if ($('#new-account-form').parsley('isValid') == true) {
        $('#new-account-form .hide input').removeAttr('disabled');
        $('.new-account #page1').fadeOut(500, function() {
            $('.new-account #page2').fadeIn(500);
        });
        // destroy
        $('#new-account-form').parsley('destroy');
        // Re-assign parsley to the form to include the second page now
        $('#new-account-form').parsley();

    } else {
        $('#new-account-form').parsley('validate');
    }
});