jquery valider: règle de validation personnalisée

Je veux que ce formulaire rende obligatoire le champ 'Nombre' si l'utilisateur sélectionne "Sí" comme réponse à la question du select. De plus, si l'utilisateur sélectionne "Sí", un e-mail ou un téléphone (dans teléfono) doit être fourni. J'utilise le plugin validate et je n'ai pas trouvé de document dans lequel une règle similaire a été codée. Comment puis-je coder ceci?jquery valider: règle de validation personnalisée

regardant the documentation, je pense que je dois coder soit une méthode required(dependency-expression) ou required(dependency-callback), mais je ne qui ni comment, depuis en cliquant sur les méthodes de leur documentation apparaît manquantes =/

<html> 
<head> 

<style type="text/css"> 

label { width: 10em; float: left; } 
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; } 
p { clear: both; } 

em { font-weight: bold; padding-right: 1em; vertical-align: top; } 
</style> 



    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script> 

    <link rel="stylesheet" type="text/css" media="screen" href="mistylesheet.css" /> 
<script> 
    $(document).ready(function(){ 
    $("#commentForm2").validate(); 
    }); 


    </script> 

</head> 
<body> 
<form id="commentForm2"> 

    <center><table class="layouttable"> 

     <tr class='row1'><td> <b>&#191;Recomendar&iacute;a nuestros servicios a otra empresa o persona? </b></td></tr> 
     <tr class='row2'><td> 



     <select id = "recomiendaONo" name="recomiendaONo" class="required"> 
      <option value="">Seleccione su respuesta</option> 
      <option value="Si">S&iacute;</option> 
     <option value="No">No</option> 

     </select> 



     </td></tr> 


    </table></center>  






<div class='margenrecomendaciones'> 
<table> 

<tbody> 


<tr> 



<td><div align="left">Nombre:</div></td> 

<td><div align="left"><input class="texto" id="nombreRecomendado" name="nombreRecomendado" type="text" size="30"/></div></td> 

</tr>  




<td><div align="left">Email:</div></td> 

<td><div align="left"> <input class="texto" id="emailRecomendado" name="emailRecomendado" type="text" size="30"/></div></td> 




</tr> 

<tr> 



<td><div align="left">Tel&eacute;fono:</div></td> 

<td><div align="left"> <input class=" texto" name="telefonoRecomendado" id="telefonoRecomendado" type="text" size="30"/></div></td> 




</tr> 


</tbody> 

</table> 
</div> 


    <center><input type="submit"></center> 


</form> 
</body> 
</html>

Source

2010-09-09 andandandand

Vous pouvez regardez leur page de démonstration et voyez l'exemple codé comment faire ce travail. Les champs sont juste désactivés avec javascript, si la sélection n'est pas sélectionnée, et quand la sélection est sélectionnée, les attributs désactivés sont supprimés.

Copier coller à partir du site de démonstration:

//code to hide topic selection, disable for demo 
var newsletter = $("#newsletter"); 
// newsletter topics are optional, hide at first 
var inital = newsletter.is(":checked"); 
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray"); 
var topicInputs = topics.find("input").attr("disabled", !inital); 
// show when newsletter is checked 
newsletter.click(function() { 
    topics[this.checked ? "removeClass" : "addClass"]("gray"); 
    topicInputs.attr("disabled", !this.checked); 
});

http://jquery.bassistance.de/validate/demo/

Source

2010-09-09 18:45:49 newbie

Merci, mais ce n'est pas ce que je cherche. – andandandand

vous devez créer votre propre règle personnalisée, et d'ajouter cette classe à vos deux champs.

Dans votre fichier js:

jQuery.validator.addMethod("newRuleOr", function(value, element) { 
     if($('#recomiendaONo').val() == 'Si'){ 
      return $('#emailRecomendado').val() != '' && $('#telefonoRecomendado').val(); 
     } 
     return true; 
    }, "Telefono o mail deben informarse." 
);

Et dans votre code html, vous devez ajouter les nouvelles classes aux champs. Une autre astuce, n'utilisez jamais de tableau pour styliser votre page, utilisez div, flottants et pourcentage.

Source

2016-03-04 13:45:01 cralfaro

jquery valider: règle de validation personnalisée

Répondre

Questions connexes