|This is basically copy-pasted from an answer I wrote on Stack Overflow. I thought it could be a good post to start off this blog with.The issue at hand is:
As a disclaimer I used the following code:
(it’s downloadable from Get The Sample Files link).
So here goes:
– In my case I wanted an input field of type number to be validated as number however I didn’t want Google Chrome to make it a number field (just try in Chrome to see what I mean)
I have chrome 27.0.1453.116 – I know I should update.
– So I had a utility JS function which automatically populated the validate rule object by parsing the form input fields after page load. (I might post the code sometime in the future)
– Two fields had to be number to be validated on the client-side but Chrome made them something like a combo-box when the input type=”number”. Moreover, this caused bypassing the native validation by Chrome – or so I think – when the user inputted manually say some characters and it looked ugly so all in all it wasn’t acceptable.
– At first I used the rules method to dynamically modify the two fields after page load.
THIS IS WHAT HAPPENED
at line 124 of jquery.validate.js
JQuery Documentation for $.data
Apparently it was returning undefined because there is no validator instance associated with the form.
Now in validate function you notice that if validator is undefined it will create a new one
The other solution would be to simply append the added rules to the initial rules object before calling
Now you will call validate only once after dynamically appending your stuff, of course this could work also on removing some attributes however I have not tested it yet.
Hope this helps,