Estou com uma duvida na validação spry, preciso que os valores de obrigatório ou não (true ou False) seja alterados de acordo com o que é inserido no campo input text.
esta mudança de valores tem que ser dinâmica sem refresh de página.
Segue abaixo os códigos jquery que tentei até o momento.
$("input[name='cpfResp']").keyup(function(){ var minimo = 14 var quantidade = $(this).val().length; if (quantidade == minimo){ $("input[name='nmResp']").val('Carregando dados ......'); $("input[name='rgResp']").val('Carregando dados ......'); $.post('include/responsavel.php', {cpf: $(this).val()}, function(valor){ responsavel = valor.split("-"); $("input[name='nmResp']").val(responsavel[0]); $("input[name='rgResp']").val(responsavel[1]); }) }else if(quantidade > 0){ $("input[name='nmResp']").val('1'); $("input[name='rgResp']").val('1'); }else{ $("input[name='nmResp']").val(''); $("input[name='rgResp']").val(''); } }); $("input[name='cpfResp2']").keyup(function(){ var minimo = 14 var quantidade = $(this).val().length; if (quantidade == minimo){ $("input[name='nmResp2']").val('Carregando dados ......'); $("input[name='rgResp2']").val('Carregando dados ......'); $.post('include/responsavel.php', {cpf: $(this).val()}, function(valor){ responsavel = valor.split("-"); $("input[name='nmResp2']").val(responsavel[0]); $("input[name='rgResp2']").val(responsavel[1]); }) }else if(quantidade > 0){ $("input[name='nmResp2']").val(''); $("input[name='rgResp2']").val(''); parentesco_true_resp2.validate(); }else{ $("input[name='nmResp2']").val(''); $("input[name='rgResp2']").val(''); parentesco_false_resp2.validate(); } }); $("input[name='cpfResp3']").keyup(function(){ var minimo = 14 var quantidade = $(this).val().length; if (quantidade == minimo){ $("input[name='nmResp3']").val('Carregando dados ......'); $("input[name='rgResp3']").val('Carregando dados ......'); $.post('include/responsavel.php', {cpf: $(this).val()}, function(valor){ responsavel = valor.split("-"); $("input[name='nmResp3']").val(responsavel[0]); $("input[name='rgResp3']").val(responsavel[1]); }) }else if(quantidade > 0){ $("input[name='nmResp3']").val(''); $("input[name='rgResp3']").val(''); parentesco_true_resp3.validate(); }else{ $("input[name='nmResp3']").val(''); $("input[name='rgResp3']").val(''); parentesco_false_resp3.validate(); } });
Criei dos spry para cada campo validado, 1 com true e outro com false, chamo eles pelo jquery usando o VALIDATE.
Se o input text tiver 1 caractere digitado ele valida com o código abaixo, tornado obrigatório selecionar alguma opção daquele campo.
parentesco_true_resp2.validate();
Se o input text estiver em branco, sem valor algum não é obrigatório selecionar nada naquele campo.
parentesco_false_resp2.validate();
script spry
<script type="text/javascript"> var parentesco_true_resp2 = new Spry.Widget.ValidationSelect("parentesco_resp2", {validateOn:["change", "blur"], isRequired:true}); var parentesco_false_resp2 = new Spry.Widget.ValidationSelect("parentesco_resp2", {validateOn:["change", "blur"], isRequired:false}); var parentesco_true_resp3 = new Spry.Widget.ValidationSelect("parentesco_resp3", {validateOn:["blur", "change"], isRequired:true}); var parentesco_false_resp3 = new Spry.Widget.ValidationSelect("parentesco_resp3", {validateOn:["blur", "change"], isRequired:false}); </script>
Pequena parte do formulário que usa a validação.
<table border="0" cellpadding="0" cellspacing="0" width="850" bgcolor="#F9FBFE" class="caixaformulario"> <TBODY> <TR> <TD colspan="7" class="Tituloformulario">Dados do Responsável - 2/3</TD> </TR> <TBODY> <TR> <TD width="29"> <TD width="819"> <table width="100%" border="0"> <te> <td width="18%" class="TxtC">CPF:</td> <td width="36%"><span id="cpf_resp2"> <label for="cpfResp2"></label> <input name="cpfResp2" type="text" id="cpfResp2" /> <span class="textfieldValidMsg"><img src="public/imagens/ok.png" width="14" height="13" alt="OK" /></span> <br /> <span class="textfieldInvalidFormatMsg">CPF Inválido.</span></span></td> </tr> <tr> <td width="15%" class="TxtC">Nome:</td> <td colspan="3"><span id="nm_resp2"> <label for="nmResp2"></label> <input name="nmResp2" type="text" id="nmResp2" onkeypress="mascara(this,texto)" onkeyup="mascara( this, toUpper )" size="80" maxlength="50" readonly="readonly" /> <span class="textfieldValidMsg"><img src="public/imagens/ok.png" width="14" height="13" alt="OK" /></span></span></td> </tr> <tr> <td class="TxtC">RG:</td> <td width="31%"><span id="rg_resp2"> <label for="rgResp2"></label> <input name="rgResp2" type="text" id="rgResp2" onkeypress="mascara(this,mrg)" readonly="readonly" /> <span class="textfieldValidMsg"><img src="public/imagens/ok.png" width="14" height="13" alt="OK" /></span></span></td> </tr> <tr> <td class="TxtC">Grau Parentesco:</td> <td><span id="parentesco_resp2"> <label for="ParentescoResp2"></label> <select name="ParentescoResp2" id="ParentescoResp2"> </select> <span class="selectValidMsg"><img src="public/imagens/ok.png" width="14" height="13" alt="OK" /></span> <br /> <span class="selectRequiredMsg">Selecione um item.</span></span></td> <td class="TxtC"></td> <td></td> </tr> </table> </td> </tr> <tr> <td height="13" colspan="5"></td> </tr> </tbody> </table>
Já tentei de diversas formas, mas essa foi a mais próxima que cheguei do que realmente estou tentando fazer, porem ainda não esta 100% funcional, pois quando clico no submit mais de 1 vez ele deixa passar o campo sem nenhum valor, no caso ele assume o valor de false, não obrigando o seu preenchimento.
Imaginei também criar uma variável e preencher ela com true e false e no HTML mudar o ID que faz a busca da validação. mas não consegui fazer até o momento.
Alguem teria alguma idéia de como fazer essa mudança de valores.
site com o formulário funcionando.:
http://www.pequenoen...=cadastrarAluno
Edição feita por: Marcelo Berto, 06/11/2010, 14:26.