Uncaught TypeError: b.each is not a function

[jasonwmatteson]

First off, thanks so much for this plugin! Very very cool!

Question: I have rows and elements that are dynamically added to the page. I need to make sure validation, sanitize, etc... apply to those new elements. The new elements all have the correct HTML attributes needed (data-sanitize="trim upper", etc...)

When I run this after I add a new row:
$.validate({form:'#myFormId', modules: 'html5, sanitize', validateOnBlur: false});

If get this error:
Uncaught TypeError: b.each is not a function

Ideas?

[jasonwmatteson]

To expound: that error is coming from the html5.js file on line 9

[victorjonsson]

You should wait before calling $.validate() if you're dynamically adding stuff to the form on page load. Everytime you add new stuff to the form you will have to re-initiate the validation. Example:

function  addStuffToTheForm() {
   // Inserting elements in the DOM
}

function setupValidation() {
    $.validate({ ... });
}

$(window).on('load', function() {
  addStuffToTheForm();
  addStuffToTheForm();
  addStuffToTheForm();

  // Now we're finished creating the form, let's initiate the validation
  setupValidation();

  $('#some-button').on('click', function() {
    addStuffToTheForm();
    setupValidation();
  });
});

[akadevil]

Hi all. I have same issue, but my input isn't added dynamically
here is my code

var config = {
            validate: {
                'videoframe': {
                    validation: 'url'
                }
            }
        }
        $.validate({
            modules: 'html5',
            onModulesLoaded: function () {
                $.setupValidation(config);
            }
        });
        $('input[name=videoframe]').keyup(function () {
            //do something
        });

it shows the same error, and I tried many times to fix it
can you please tell me why do I have this issue?

[victorjonsson]

I don't understand the config variable, are you also using the jsconf module? Could you please provide me with the markup of the form?

[victorjonsson]

I really need to see more code. This isn't enough for me to reproduce the error, it works fine http://jsbin.com/qetumezise/edit?html,console,output

[akadevil]

function Tree() {
    this.__init.call(this);
};

Tree.prototype = {
 __init: function () {
var self = this;
  self._initEvents();
}
  _initEvents: function () {
   var config = {
            validate: {
                'videoframe': {
                    validation: 'url'
                }
            }
        }
        $.validate({
            modules: 'html5, jsconf',
            onModulesLoaded: function () {
                $.setupValidation(config);
            }
        });
  }
}
var TreeCLASS = new Tree();

it shows error 2 times

Uncaught TypeError: b.each is not a functionf @ html5.js:9(anonymous function) @ html5.js:9n.event.dispatch @ jquery.js:4435r.handle @ jquery.js:4121n.event.trigger @ jquery.js:4350(anonymous function) @ jquery.js:4901n.extend.each @ jquery.js:374n.fn.n.each @ jquery.js:139n.fn.extend.trigger @ jquery.js:4900(anonymous function) @ jquery.form-validator.min.js:306n.extend.each @ jquery.js:374n.fn.n.each @ jquery.js:139a.validate @ jquery.form-validator.min.js:303a.setupValidation @ jsconf.js:9$.validate.onModulesLoaded @ script.js:132(anonymous function) @ jquery.form-validator.min.js:324h @ jquery.form-validator.min.js:339
html5.js:9 Uncaught TypeError: b.each is not a function

[victorjonsson]

Could you load html5.dev instead?

[akadevil]

it shows
Uncaught TypeError: $form.each is not a function

[victorjonsson]

This should now be fixed.