I want this form to make the field 'Nombre' required only if the user picks "Sí" as the answer to the select's question. Additionally, if the user selects "Sí", either an email or a phone (in teléfono) should be provided.
I'm using the validate plugin and haven't found a doc in which a similar rule has been coded. How can I code this?
Looking at the documentation, I think I need to code either a required(dependency-expression)
or required(dependency-callback)
method, but I don't which or how, since when clicking the methods their documentation appears missing =/
<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>¿Recomendarí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í</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é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>