Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola amigos! estou com problemas em usar ajax tenho um conhecimento basico de js e nao conheço bem jquery a nao ser algumas experiencias com o plugin validate. O form esta validado com o plugin validate, mas depois que adicionei o script ajax se submeter o formulario aparece as mensagens de validação na pagina e o banco recebe um registro com os campos em branco como se o ajax ignorasse o validate. O código rodava perfeitamente em php e mysql tentei adicionar o submitHandle conseguir corrigir o problema de validação mas os dados do form n sao enviados para o banco. Nao estou conseguindo cadastrar os dados se usar o submitHandle. Sei que devo estudar mais js e conhecer jquery mas tenho que entregar essa requisição no trabalho e to perdido. Segue o código:
<script src="js/jQuery/jquery-1.11.3.min.js" > </script>
<script type="text/javascript" src="js/jQuery/jquery.validate.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$('#formCondominio').submit(function(){
var dados = $( this ).serialize();
$.ajax({
type: "POST",
url: "inserir.php",
data: dados,
success: function envio(){
alert("Cadastro realizado com sucesso");
window.location="index.html";
}
});
return false;
});
});
</script>
<form id="formCondominio" method="POST" action="" >
//Nao vou postar o form pra reduzir a leitura
//script php
<?php
include"conexao.php";
$fnomeCompleto=$_POST["nomeCompleto"];
$fcpf=$_POST["cpf"];$chars= array(".",".","-");
$fcpf= str_replace($chars,"",$fcpf);
}
$femail=$_POST["email"];
$fusuario=$_POST["usuario"];
$fsenha=$_POST["senha"];
$fcondominio=$_POST["condominio"];
$fapto=$_POST["apto"];
$ftelefone=$_POST["telefone"];$chars= array("(",")","-");
$ftelefone= str_replace($chars,"",$ftelefone);
}
$fdataN=$_POST["dataN"];
$fdataN=$_POST["dataN"];
$fsexo=$_POST["sexo"];
$sql="INSERT INTO condominios VALUES('$fnomeCompleto', '$fcpf', '$femail', '$fusuario', '$fsenha',
'$fcondominio', '$fapto', '$ftelefone', '$fdataN', '$fsexo')";
$res= mysql_query($sql, $con) or die(mysql_error());
$fcpf=$_POST["cpf"];$chars= array(".",".","-");
$fcpf= str_replace($chars,"",$fcpf);
}
$ftelefone2=$_POST["telefone2"];
$ftelefone2=$_POST["telefone2"];$chars= array("(",")","-");
$ftelefone2= str_replace($chars,"",$ftelefone2);
}
if (isset($fcarro)) {
$fmoto=$_POST["carro"] == "sim";
}else{
$fcarro=$_POST["carro"] = "nao";
}
$fqtdCarro=$_POST["qtdCarro"];
if (isset($fmoto)){
$fmoto=$_POST["moto"] == "sim";
}else{
$fmoto=$_POST["moto"] = "nao";
}
$fqtdMoto=$_POST["qtdMoto"];
$sql="INSERT INTO info_adicional VALUES('$fcpf', '$ftelefone2', '$fcarro', '$fqtdCarro', '$fmoto', '$fqtdMoto')";
$res= mysql_query($sql, $con) or die();
mysql_close($con);
?>Ola william! muito obrigado por responder.
Eu ja tinha feito pelo seu exemplo agora o script esta assim:
A validação esta em um script externo. Agora ele valida certinho e n registra mais em branco. O problema é que apos submeter o form os dados n sao enviados para minha pagina php, ele nem entra no alerta contido no sucess.
<script type="text/javascript">
submitHandler: function( form ){
var dados = $( form ).serialize();
$.ajax({
type: "POST",
url: "inseir.php",
data: dados,
success: function envio(){
alert("Cadastro realizado com sucesso");
window.location="index.html";
}
});
return false;
}
</script>o submitHandler tem que ficar no mesmo script da validação. Ele depende do outro. Você não pode separar assim não.
William
Ja fiz a alteração so que ainda n funciona e percebi que a pagina atualiza mas permanece na mesma pagina de cadastro.
<script type="text/javascript">
$(document).reay(function(){
$("#formCondominio").validate({
rules:{
nomeCompleto:{required: true},
cpf:{required: true},
email:{required: true,email: true},
usuario:{required: true},
senha:{required: true, minlength:8},
confsenha:{required: true, equalTo: "#xsenha"},
sexo:{required: true},
condominio:{required: true},
apto:{required: true},
cod_ddd:{required:true},
telefone:{required:true},
qtdCarro:{required: "#xcarro:checked"},
qtdMoto:{required: "#xmoto:checked"},
dataN:{required: true}
},
messages:{
nomeCompleto:{required: "Obrigatório."},
cpf:{required: "Obrigatório."},
email:{required: "Obrigatório.",email: "Insira um email valido."},
usuario:{required: "Obrigatório."},
senha:{required: "Obrigatório.",minlength: "A senha deve ter 8 caracteres no minimo."},
confsenha:{required: "Obrigatório.", equalTo: "senhas nao conferem."},
sexo:{required: "Obrigatório."},
condominio:{required: "Obrigatório."},
apto:{required: "Obrigatorio."},
cod_ddd:{required: "Obrigatório."},
telefone:{required:"Obrigatório."},
qtdCarro:{required: "Informe a quantidade de veiculo."},
qtdMoto:{required: "Informe a quantidade do veiculo."},
dataN:{required: "Obrigatório."}
},
submitHandler: function( form ){
var dados = $( form ).serialize();
$.ajax({
type: "POST",
url: "inseir.php",
data: dados,
success: function envio(){
alert("Cadastro realizado com sucesso");
window.location="index.html";
}
});
return false;
}
});
});
<script>A página não deveria atualizar.
Verifique no console Ctrl + Shift + J no Firefox ou Chrome e veja quais erros aparecem, também verifique na aba Network se a requisição XHR está indo até o servidor.
Depois disso, só vai restar o debug linha a linha para entender o que está acontecendo.
William aqui esta os erros como n sei identificar escrevi pra você ver:
cadastrar2.html:17 Uncaught TypeError: $(...).reay is not a function
jquery2.js:3 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
aba XHR
Name stat type initiator size Time
content.html 200 xhr jquery.js:8625 (from cache) 2 ms
s.js 200 xhr jquery2.js:3 219 B 8 ms
Ali em cima, troque:
$(document).reay(function(){por
$(document).ready(function(){e continue acompanhando, veja se aparecem mais erros.Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
jquery-1.11.3.min.js:5 POST http://localhost/projeto2/inseir2.php 404 (Not Found)
aba XHR
Name stat type initiator size Time
inseir2.php 404 xhr jquery-1.11.3.min.js:5 1.7 KB 515 ms
Quando clico em inserir.php no xhr diz que a pag php nao foi encontrada, mas a pag esta no local certo do htdocs.
Tem algo errado no caminho. Corrija isso.
se chama inseir? ou é inseRir ? olhe com atenção.
william muito obrigado! parabens pelo blog
A melhor forma é mesmo com o submitHandler, veja um exemplo funcional:
http://wbruno.com.br/jquery/validar-enviar-formulario-ajax-usando-jquery-validate/