Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia colegas, sou novo por aqui.
Pesquisei na net e aqui e não achei uma solução, então:
No script abaixo, crio normalmente os campos de um form dinamicamente, mas na hora da validação eles não são reconhecidos, portanto se alguem tiver uma dica, fico grato.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.1.js'></script>
<script type='text/javascript' src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){/*
$("#addFone").click(function(){
novoFone('Celular');
});*/
$("#addFone").live('click',function(){
novoFone('Celular');
});
});// criando campos dinamicamente no form
function novoFone(tipo, numero){
var selected_0 = "";
var selected_1 = "";
var selected_2 = "";
var selected_3 = "";
var selected_4 = "";
var selected_5 = "";
if(typeof(tipo) != "undefined" ){
switch(tipo) {
case '': selected_0 = 'selected="selected"'; break;
case 'Celular': selected_1 = 'selected="selected"'; break;
case 'Comercial': selected_2 = 'selected="selected"'; break;
case 'Residêncial': selected_3 = 'selected="selected"'; break;
case 'Fax': selected_4 = 'selected="selected"'; break;
case 'Nextel': selected_5 = 'selected="selected"'; break;
}
}
if(typeof(numero) == "undefined" ){
numero = "";
}
var input = '<div class="dinamicos">';
input += '<select name="fone_tipo[]" style="width: 110px" class="combobox">';
input += ' <option value="-1" '+selected_0+'></option>';
input += ' <option value="Celular" '+selected_1+'>Celular</option>';
input += ' <option value="Comercial" '+selected_2+'>Comercial</option>';
input += ' <option value="Residêncial" '+selected_3+'>Residêncial</option>';
input += ' <option value="Fax" '+selected_4+'>Fax</option>';
input += ' <option value="Nextel" '+selected_5+'>Nextel</option>';
input += ' </select>';
input += ' <input name="fone_num[]" style="width: 180px" value="'+numero+'"/>';
input += ' <a href="#" class="del_dinamico" title="Excluir telefone"></a></div>';
//
$("#fones").append(input);
//
return false;
}//
$(document).ready(function($){
$("#form1").validate({
submitHandler:function(form) {
alert('Enviado');
},
rules: {
nome: {
required: true
},
email:{
required: true,
email: true
},
fone_num:{
required: true
}
},
messages: {
nome: "Nome obrigatorio!",
email: "Informe um email válido!",
fone_num: "Telefone obrigatorio!"
}
});
});
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="#">
<p>
<label for="nome">Nome:<br />
</label>
<input name="nome" type="text" id="nome" size="50" />
</p>
<p>
<label for="email">Email:<br />
</label>
<input name="email" type="text" id="email" size="50" />
</p>
<div id="fones"></div>
<a href="#" id="addFone" class="add_dinamico" >Adicionar telefone</a>
<br />
<br />
<br />
<input type="submit" name="button" id="button" value="Enviar" />
</form>
</body>
</html>Carregando comentários...