2010-09-09 3 views
4

Я хочу, чтобы эта форма сделала поле «Nombre» обязательным, только если пользователь выбирает «S» в качестве ответа на вопрос о выборе. Кроме того, если пользователь выбирает «S», следует предоставить либо электронную почту, либо телефон (в teléfono).jquery validate: custom validation rule

Я использую плагин validate и не нашел документ, в котором аналогичное правило было закодировано. Как я могу это кодировать?

Глядя на the documentation, я думаю, мне нужно кодировать либо в required(dependency-expression) или required(dependency-callback) метод, но я не которые или как, так как при нажатии методы их документации появляется отсутствующий =/

<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> 

ответ

0

Вы можете посмотрите их демонстрационную страницу и посмотрите пример hardcoded, как сделать эту работу. Поля просто отключены с помощью javascript, если выбор не выбран, а при выборе выбора отключены атрибуты.

Copy паста с демо-сайта:

//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/

+0

Спасибо, но это не то, что я ищу. – andandandand

0

вам нужно создать собственное правило и добавить этот класс в обоих полях.

В файле JS:

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

И в вашем HTML код, который вы должны добавить новые классы полей.

<input class="texto newRuleOr" id="nombreRecomendado" name="nombreRecomendado" type="text" size="30"/> 
... 
<input class="texto newRuleOr" id="emailRecomendado" name="emailRecomendado" type="text" size="30"/> 

Еще один совет, никогда не используйте таблицу для стилизации своей страницы, используйте divs, floats и проценты.