jQuery validate Uncaught TypeError Cannot read property nodeName of null

Question

I have the following code     document  ready       function                    validator addMethod           lessThan           function  value  element  param                           bind to the blur event of the target in order to revalidate whenever the target field is updated                         var target     param               unbind   validate-lessThan                bind                                blur validate-lessThan                   function                                            element  valid                                                 return parseFloat value   lt   parseFloat target val                         Valoarea trebuie sa fie mai mica sau egala decat valoarea initiala                            gvListDetaliiElemTranAdaugare input name  Valoare    each               function  index  domEle                          this  rules                                add                                           required  true                      minlength  1                      range   0 1  Number MAX VALUE                       lessThan    ListaDetaliiElemTranModelAdaugare     index      ValoareRamasa                       messages                                                required   Valoarea este necesara                            minlength   Valoarea este necesara                            range   Valoarea este necesara                            lessThan   Valoarea trebuie sa fie mai mica sau egala cu         ListaDetaliiElemTranModelAdaugare     index      ValoareRamasa   val                                                                               The code fails then it reeaches   this  rules   with  Uncaught TypeError  Cannot read property  nodeName  of null   the html returned by     gvListDetaliiElemTranAdaugare input name  Valoare    is      lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 0  Valoare  name   ListaDetaliiElemTranModelAdaugare 0   Valoare  onchange   OnValoareChange   this   val     18590   0    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 1  Valoare  name   ListaDetaliiElemTranModelAdaugare 1   Valoare  onchange   OnValoareChange   this   val     22972   1    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 2  Valoare  name   ListaDetaliiElemTranModelAdaugare 2   Valoare  onchange   OnValoareChange   this   val     23036   2    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 3  Valoare  name   ListaDetaliiElemTranModelAdaugare 3   Valoare  onchange   OnValoareChange   this   val     23038   3    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 4  Valoare  name   ListaDetaliiElemTranModelAdaugare 4   Valoare  onchange   OnValoareChange   this   val     425306   4    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 5  Valoare  name   ListaDetaliiElemTranModelAdaugare 5   Valoare  onchange   OnValoareChange   this   val     425308   5    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 6  Valoare  name   ListaDetaliiElemTranModelAdaugare 6   Valoare  onchange   OnValoareChange   this   val     425309   6    type   text  value   0 00000000000  gt       lt input data-type   decimal  id   ListaDetaliiElemTranModelAdaugare 7  Valoare  name   ListaDetaliiElemTranModelAdaugare 7   Valoare  onchange   OnValoareChange   this   val     425310   7    type   text  value   0 00000000000  gt

User · Answer

The problem happened because I was trying to bind a HTML element before it was created   My script was loaded on top of the HTML and it needs to be loaded at the bottom of my HTML code

User · Answer

I have found the problem   The problem was that the HTML I was trying to validate was not contained within a  lt form gt     lt  form gt  tag   As soon as I did that  I had a context that was not null

User · Answer

Extract from the oficial docs   Requires that the parent form is validated  that is      form    validate   is called first  more about    rules

User · Answer

I found this answer when I was getting a similar error for nodeName after upgrading to Bootstrap 4  The issue was that the tabs didn t have the nav and nav-tab classes  adding those to the  lt ul gt  element fixed the issue

User · Answer

I ran into this issue when the number of  lt th gt  tags in the    did not match the number of  in the  lt tfoot gt  section  lt thead gt       lt tr gt           lt th gt  lt  th gt           lt th gt Subject Areas lt  th gt           lt th gt  lt  th gt           lt th gt Option s  lt  th gt       lt tr gt   lt  thead gt    lt tbody gt  lt  tbody gt    lt tfoot gt       lt tr gt           lt th gt  lt  th gt           lt th gt  lt  th gt           lt th gt  lt  th gt           lt th gt  lt  th gt       lt  tr gt   lt  tfoot gt

User · Answer

I had this problem and it was because the panel was outside of the  data-role  page   element

User · Answer

I had this problem in a Backbone project  my view contains a input and is re-rendered   Here is what happens  example for a checkbox     The first render occurs  jquery validate is applied  adding an event onClick on the input  View re-renders  the original input disappears but jquery validate is still bound to it    The solution is to update the input rather than re-render it completely  Here is an idea of the implementation   var MyView   Backbone View extend       render  function            if this rendered               this update                return                    this rendered   true           this  el html tpl this model toJSON              return this             update  function            this  el find  input type  checkbox     prop  checked   this model get  checked             return this              This way you don t have to change any existing code calling render    simply make sure update   keeps your HTML in sync and you re good to go

[validation] jQuery validate Uncaught TypeError: Cannot read property 'nodeName' of null

Examples related to validation

Examples related to jquery-validate