Question

我需要对动态控件使用jquery验证。我试过但我无法实现它。在这个问题上帮助我。

查看：

<script type="text/javascript">
    $(document).ready(function () {
        var count = 0;
        $("#dynamicControlForm").validate();
        $("#AddControls").click(function () {
            count++;
            var elements = "<input type='text' id='txt" + count + "'class='rec'/><br/></br>";
            $(elements).appendTo("#dynamicControlForm");
            $(".rec").each(function () {
               $(this).rules("add", {
                required: true,
                messages: {
                    required: "Required field"
                }
            });
            });
        });
    });
</script>
<div id="DynamicControlsContainer">
    <input type="button" name="CreateControl" value="AddControl" id="AddControls" />
    <form action="/" method="post" id="dynamicControlForm">
    <input type="submit" name="DynamicControl" id="btnDynamicSubmit" value="Submit" />
    </form>
</div>

Answer 1

您的代码非常接近。

但是，动态创建的name元素中缺少input属性。

jQuery Validate插件要求所有要验证的数据输入元素必须每个都具有唯一的name属性。

这有效......

$(document).ready(function () {

    $(document).ready(function () {
        var count = 0;
        $("#dynamicControlForm").validate();
        $("#AddControls").click(function () {
            count++;
            var elements = "<input type='text' id='txt" + count + "' name='txt" + count + "' class='rec'/><br/></br>";
            $(elements).appendTo("#dynamicControlForm");
            $(".rec").each(function () {
                $(this).rules("add", {
                    required: true,
                    messages: {
                        required: "Required field"
                    }
                });
            });
        });
    });

});

工作演示：http://jsfiddle.net/sVFgK/

Jquery验证不适用于动态控件

1 个答案: