Jquery Validation is not working for dynamic controls

Question

I need to use jquery validation for dynamic controls. I tried but i was unable to achieve it. Help me on this issue.

Views:

<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

Your code is very close.

However, the name attribute is missing from your dynamically created input elements.

The jQuery Validate plugin requires that all data input elements to be validated must each have a unique name attribute.

This works...

$(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"
                    }
                });
            });
        });
    });

});

Working DEMO : http://jsfiddle.net/sVFgK/