2012-10-03 53 views
26

Tengo el siguiente código:jQuery validar TypeError no detectada: No se puede leer la propiedad 'nombreNodo' de null

$(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) <= 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() 


        } 
       } 
      ); 
     } 
    ); 

El código de falla, entonces reeaches $ (this) .rules() con: Uncaught TypeError: Cannot read property 'nodeName' of null. el HTML devuelto por $('#gvListDetaliiElemTranAdaugare input[name$=Valoare]') es:

[ 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_0__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[0]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 18590 , 0)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_1__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[1]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 22972 , 1)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_2__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[2]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 23036 , 2)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_3__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[3]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 23038 , 3)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_4__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[4]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425306 , 4)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_5__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[5]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425308 , 5)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_6__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[6]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425309 , 6)​" type=​"text" value=​"0.00000000000">​ 
, 
<input data-type=​"decimal" id=​"ListaDetaliiElemTranModelAdaugare_7__Valoare" name=​"ListaDetaliiElemTranModelAdaugare[7]​.Valoare" onchange=​"OnValoareChange($(this)​.val()​, 425310 , 7)​" type=​"text" value=​"0.00000000000">​ 
] 
+0

¿por qué no solo está agregando la función de validación con sus reglas como propiedades en json? –

+0

porque necesito un ejemplo –

+0

visite esta página http://jquery.bassistance.de/validate/demo/ –

Respuesta

69

he encontrado el problema.

El problema era que el HTML que intentaba validar no estaba dentro de una etiqueta <form>...</form>.

Tan pronto como lo hice, tuve un context que no era nulo.

+4

Este me sorprendió por casi 2 horas ... el elemento debe estar dentro de un formulario. Duhhhh :(¡Gracias por compartir! :) Solo por mencionar: en mi caso, estaba tratando de agregar una regla a un archivo de entrada. Este es el error tan útil que obtuve en Firebug: 'elem null' en esta línea jQuery:' f (elem.nodeType && elem.nodeType! == 1 && elem.nodeType!== 9) ' –

+2

Me hizo como un idiota en la última hora, todos los campos estaban en una forma pero cuando el diálogo jQuery se abrió, los sacó del formulario, luego la validación falló con un extraño mensaje de error. ¿Por qué jQuery UI no emite un mensaje de advertencia en la consola? –

4

El problema ocurrió porque estaba intentando vincular un elemento HTML antes de que se creara.

Mi secuencia de comandos se cargó en la parte superior del HTML y debe cargarse en la parte inferior de mi código HTML.

+0

mismo caso para mí, También estaba agregando reglas en el formulario anidado antes del evento de inserción. ¡Gracias hombre! –

0

Tuve este problema y fue porque el panel estaba fuera del elemento [data-role = "page"].

4

Tuve este problema en un proyecto de red troncal: mi vista contiene una entrada y se vuelve a representar. Esto es lo que sucede (ejemplo de una casilla de verificación):

  • Se produce la primera representación;
  • jquery.validate se aplica, agregando un evento onClick en la entrada;
  • Ver re-renders, la entrada original desaparece pero jquery.validate aún está vinculado a ella.

La solución es actualizar la entrada en lugar de volver a procesarla por completo. He aquí una idea de la aplicación:

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; 
    } 
}); 

De esta manera usted no tiene que cambiar el código existente llamando render(), sólo tiene que asegurarse de actualización() mantiene su HTML en sincronía y ya está bueno para ir .

+0

No entiendo esto, ¿podría decirme cómo aplicarlo en la práctica? – user3808307

0

Encontré esta respuesta cuando recibía un error similar para nodeName después de actualizar a Bootstrap 4. El problema era que las pestañas no tenían las clases nav y nav-tab; agregarlos al elemento <ul> solucionó el problema.

Cuestiones relacionadas