2011-11-08 8 views
5

Hola, yo uso el validador jQuery para un formulario. Funcionó bien hasta hoy. He añadido un nuevo código para el formulario que se suma/quitar campos adicionales a la forma (con clases ajustado en "requeridos") ..El complemento del validador de Jquery no comprueba las nuevas entradas

la forma básica es algo como>

<form name="form" id="form"> 
    <input name="text1" class="required"> 
    <a id="addnew">Add new text</a> 
<div id="newitems"></div> 
    <submit> 
    </form> 

El código I su uso es

<script type="text/javascript"> 
     $(document).ready(function({ $("#form").validate(); 
     $("#addnew").click(function({ 
     $("#newitems").append('<input class="required" name="newinput">'); 
}); }); 
</script> 

la idea es que cuando alguien haga clic en el Añadir nuevo texto dentro del formulario se añade un nuevo campo. Mi problema es que entonces el Validator no funciona en el nuevo campo porque ya está cargado para el formulario ... ¿Cómo puedo configurar el javascript para verificar y los nuevos campos?

no he copiar el código exacto de mi sitio web porque es muy larga ..

This Is the validation plugin - its the most used validator on jquery

Respuesta

5

Al crear su nuevo elemento de formulario, debe informar al complemento de validación para verificarlo agregando una regla. Agregar la clase 'requerida' a un elemento solo alerta al complemento si el elemento está presente en la carga del documento. Pruebe esto:

$(document).ready(function({ 
     $("#form").validate(); 
     $("#addnew").click(function({ 
      var input = $("<input />").attr("name", "newinput"); 
      $("#newitems").append(input); 
      input.rules('add', {'required': true}) 
     }); 
    }); 
+0

Si bien este es el curso de acción correcto, no está funcionando para elementos añadidos dinámicamente. Aún necesita pegar y volver a enlazar todo. –

1

si va a agregar contenido dinámico cualquiera de existentes sin afectar a los nuevos controles. tienes que asignar el evento nuevamente después de modificar el dom. así que llame al validador nuevamente después de la modificación del dom.

1

Tiene que volver a enlazar el evento después de cargar el contenido dinámico.

si está agregando contenido dinámico cualquiera de los existentes que no afecta a los controles nuevos. tienes que asignar el evento nuevamente después de modificar el dom. así que llame al validador nuevamente después de la modificación del dom.

Si desea volver a enlazar sólo tiene que llamar de nuevo

$("#addnew").click(function({ 
     $("#newitems").append('<input class="required" name="newinput">'); 
     }); 

También puede ponerlo en una función

function rebindit() { 
$("#addnew").click(function({ 
    $("#newitems").append('<input class="required" name="newinput">'); 
    }); 
} 

y cada vez que cambia el contenido de las llamadas rebindit();

+0

¿Cómo enlazarlo? – Svetoslav

+0

editado @Svetlio – John

+0

Al vincular un enlace lo disparará dos veces, primero debe borrar el elemento actualmente encuadernado ... –

0

Hay un evento de cambio en javascript que se activa cuando cambia el contenido del campo. Puede utilizarlo en el nuevo campo para aprovechar la validación de ese campo también.

Cuestiones relacionadas