jQuery使用Knockout销毁/重新创建的表单上的验证

时间:2013-05-03 02:31:04

标签: jquery knockout.js jquery-validate jquery-ui-dialog

我有一个jQuery UI对话框中的表单,每次打开和关闭对话框时都会创建和销毁该表单(作为敲除自定义绑定的一部分)。问题是jQuery验证在对话框第一次打开时有效,但如果我关闭然后重新打开对话框则不起作用。

以下是jQuery UI对话框中表单的简化代码段:

<div id="product-panel" data-bind="dialog: { autoOpen: false, destroyOnClose: true }, showDialog: $parent.selectedProduct">
    <form data-bind="submit: saveMe" id="product-form" method="post">

        <label>
            Name
            <input type="text" id="productName" name="productName" data-bind="value: productName">
        </label>

        <button type="submit" class="button">save</button>
    </form>
</div>

我也会显示ko.bindingHandlers.dialog的内容,但我认为它与问题无关。关于对话框自定义绑定的一件事就是它将jQuery UI对话框配置为在它关闭时被销毁。

我使用jQuery的on()方法在对话框再次打开时将验证重新绑定到表单:

$("body").on("dialogopen", "#product-panel", function(event) { 
    $('#product-form').validate({
        rules: {
            productName: { 
                required: true
            }
        }
    });
});

有什么想法?哦,我不想使用敲除验证(出于其他原因)。

jquery 2.0,jquery ui 1.9.2,jquery validation 1.11.1,knockout 2.2.0

1 个答案:

答案 0 :(得分:1)

为什么要摧毁并重新创建您只想打开的内容?&gt; close-&gt; open-&gt; close-&gt;等?

如果jQuery Validation在第一次打开时正常工作,那么不会销毁它,因为无论如何你只需要再次使用它。

destroyOnClose: false

如果你永远不会摧毁它,你就不必再打电话给.validate()了,所以你可以摆脱这个......

$("body").on("dialogopen", "#product-panel", function(event) { 
    $('#product-form').validate({...});
});