jezzipin jezzipin - 18 days ago 6
jQuery Question

Issue with jQuery validate : TypeError: t.data(...) is undefined

I'm currently running the following jQuery plugin to validate all of my forms within our system.

http://jqueryvalidation.org/

As our html relies on css classes, I am using the following code to apply a rule to all fields that have the class .required:

$('form').each(function(){
$(this).validate();
$('.required').each(function(){
$(this).rules('add',{
required: true,
messages: {
required: "This field is required"
}
});
});
});


However, when trying this in Firefox, Firebug gives me the following error:

TypeError: t.data(...) is undefined


This is within the plugin itself and not my code although I believe that when my code makes a call to this plugin the plugin cannot handle the way it needs to be executed. Has anyone else encountered this error?

My form is currently a mixture of text fields, drop-down menus and radio buttons all with the same class of .required. Unfortunately I cannot change the HTML as it is dynamic and built into our underlying system (so it is generated using PL/SQL procedures).

Unfortunately I cannot post a link to the form in question as our system would require you to login however I can try and replicate it in a fiddle if the code above is not enough to go on.

Any help would be greatly appreciated.

Kind regards,

Jason Espin

EDIT:

If it helps, the plugin code is hot linked from here and I have not made any modifications to it:

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.min.js"></script>

Answer

Your each function is redundant as if the field has a class of "required" the it will have the required method applied to it as a class rule, and the default message is 'this field is required'

$('form').each(function(){
    $(this).validate();
    //$('.required').each(function(){
    //    $(this).rules('add',{
    //        required: true,
    //        messages: {
    //            required: "This field is required"
    //        }
    //    });
    //});
});

you can verify the 'required' rule is still applied to your fields by running this in the browser console:

$('#fieldtotest').rules();