Dynamic form validation

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
pcoder
Forum Contributor
Posts: 230
Joined: Fri Nov 03, 2006 5:19 am

Dynamic form validation

Post by pcoder »

Hi All,
I tried a lots of way to validate a dynamic form. Validation is always works with the element ID right?
Sometimes, it seems like the validation is working with the element NAME. I give you this example.

Code: Select all

 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dynamic Form Validation</title>
<script type="text/javascript" src="../lib/jquery.js"></script>
<script type="text/javascript" src="../jquery.validate.js"></script>
<script type="text/javascript">
    jQuery().ready(function(){
        var jsonRules = {
            rules: {
                full_name: {
                    required: true
                }
            }
        };
        jQuery("#test_form").validate(eval(jsonRules));
        var template = jQuery.format(jQuery("#template").val());
        function addRow(){
            jQuery(template(i++)).appendTo("#divPrimary");
            var j = i-1;
            jQuery("#address_"+j).rules("add", "required");
        }
        var i = 1;
        addRow();
        jQuery("#add").click(addRow);   
    });
    
</script>
</head>
 
<body>
<textarea id="template" style="display:none">
    <div id="template_id_{0}">
    <p>Address: <input type="text" name="address" id="address_{0}" /></p>
    </div>
</textarea>
<form action="" name="test_form" id="test_form" method="post">
<p>Name: <input type="text" name="full_name" id="full_name" /></p>
<div id="divPrimary"></div>
<p><input type="submit" name="Go" value="Go" /></p>
</form>
<button id="add">Add More</button>
</body>
 
Here, if you notice, I have added the dynamic content inside the textarea. And the address has the fixed NAME(address). But the ID increments dynamically.
Now, this dynamic form works perfectly when I increment the NAME like ID. If the validation is happening with the ID, then why I am not getting the validation?
Hope to get your views.

Thanks
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Dynamic form validation

Post by josh »

I use jquery.validate. I prefer the meta-data plugin support, you basically embed json into the class tag of the element. Keeps things nice and close to where they are actually used so you're not scanning up to the top of the .html template to look for what validations are added.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Dynamic form validation

Post by califdon »

I've never seen a <div> (and a <p>) element inside a <textarea> element. Is that even valid??
User avatar
pcoder
Forum Contributor
Posts: 230
Joined: Fri Nov 03, 2006 5:19 am

Re: Dynamic form validation

Post by pcoder »

Thanks Josh for the reply. I think, Still this is not the solution. Rules will be overwrite because of the same NAME. Validations is always works with the element NAME.
And in my case, NAME is always same.:-(
I've never seen a <div> (and a <p>) element inside a <textarea> element. Is that even valid??
Yes Califdon, this is not the better way to implement. It's a kind of hacked way. Actually, I got this stuff from the jQuery validation section.
Post Reply