2011-09-08 11 views
5

Tengo un radiobutton que oculta/muestra un div. Todos los elementos visibles son "necesarios", pero añadiendo ignoran: ": oculto" después de las reglas de validación, no funciona ... Aquí está el código:jquery validator - Validando elementos visibles solo

<script type="text/javascript"> 

     $(document).ready(function(){ 
      $("#myForm").validate({ 
       rules: { 
        name: "required", 
        age: "required", 
        height: "required", 
        ignore: ":hidden" 
       } 
      }) 
     }); 

    </script> 
</head> 
<body> 
    <form id="myForm" name="myForm" method="post" action="" > 
     <input type="radio" name="checkAge" value="adult" onclick="$('#minorRequisites').hide();" />Adult<br/> 
     <input type="radio" name="checkAge" value="minor" onclick="$('#minorRequisites').show()" checked="checked"/>Child<br/> 
     Name <input id="name" name="name" type="text" /><br/> 
     <div id="minorRequisites"> 
      Age <input id="age" name="age" type="text" /><br/> 
      Height <input id="height" name="height" type="text" /><br/> 
     </div> 
     <input type="submit" /> 
    </form> 
</body> 

Quiero ser capaz de envíe el formulario con el nombre solo si "Adulto" está marcado ... ¿Alguna idea? :)

Respuesta

10

Puede especificar dependency expressions en sus required reglas de tenerlos ignoran los elementos si no son visibles:

$("#myForm").validate({ 
    rules: { 
     name: "required", 
     age: { 
      required: "#age:visible" 
     }, 
     height: { 
      required: "#height:visible" 
     } 
    } 
}); 

se puede ver el resultado en this fiddle.

EDIT:ignore también trabajar, pero es una opción , no una regla, por lo que debe escribir:

$("#myForm").validate({ 
    ignore: ":hidden", 
    rules: { 
     name: "required", 
     age: "required", 
     height: "required" 
    } 
}); 
+0

Gracias! : D Es tan extraño que ignorar: (": hidden") no funciona, aunque ... – Caveman

+0

@Caveman, eso es porque 'ignorar' es una opción, no una regla. Actualizaré mi respuesta. –

+0

argh! Esto fue como poner un ';' al final de 'para' y preguntándose por qué no estaba funcionando ... ¡Muchas gracias! :) – Caveman

0

Inténtelo ignore: ":not(:visible)" en lugar de ignore: ":hidden".

Cuestiones relacionadas