Boa noite.
Tenho duas páginas uma inicial.php e outra que é o cadastro.php, bom estou chamando a cadastro dentro de uma div. usando ajax. Porem me deparei com um problema, não conseguia acessar o .click do botão do cadastro.php, Depois de pesquisar bastante, fiz a leitura dos documentos do .on, .live, .delegate e .bind e como estou suando o Jquery 1.7.x optei por usar o .on para executar o .click do botão da página cadastro.php.
Até aqui tudo bem, o problema é que quando cadastro o primeiro registro esta tudo ok... a mensagem devolvida é ( Cadastro efetuado com sucesso), mais se clico de novo no botão mesmo com o formulário vazio, ele me mostra tanto a mensagem de cadastro efetuado com suc.... tanto a mensagem de que o campo nome deve ser preenchido, e assim sucessivamente cada vez que clico no botão a mensagem só vai ficando maior ele só vai repetindo, como se o formulário nunca estivesse limpo ou melhor a requisição nunca se fechasse. Vou postar o código abaixo.
Se alguém entendeu por favor me ajudem.
$('#conteudo_mostrar').on('click','#cadastrar',function(){
$('#form-cad').submit(function(e){
e.preventDefault();
$.ajax({
url: '<?php echo base_admin('usuarios/cadastro_user'); ?>',
type: 'post',
dataType: 'html',
data: {
'nome_usuario': $('#nome_usuario').val(),
'email_usuario': $('#email_usuario').val(),
'senha_usuario': $('#senha_usuario').val()
},
success: function(data){
$('#resposta').css({display:"block"});
$("#resposta").append(data).show();
},
beforeSend: function(){
$('#loading').css({display:"block"});
},
complete: function(msg){
$('#loading').css({display:"none"});
},
error: function(){
$('#error').css({display:"block"});
$("#error").html('Dados não cadastrados!!');
}
}).done(function(data){
$('#nome_usuario').val('');
$('#email_usuario').val('');
$('#senha_usuario').val('');
setTimeout(function() {
$('#resposta').empty();
$("#resposta").hide();
}, 3000);
});
});
});