2014-07-18 199 views
-2

我想从AJAX发布成功函数来释放验证函数。它工作正常,因为它打我自己的API,我可以看到它是击中URL和服务器输出一个HTTP 200.Ajax没有功能

但我需要我的AJAX功能运行在同一页面和警报验证。

脚本

var $form = $('#formDiaDosPais'); 
var dados = {}; 
dados.Nome = $form.find("input[name='Nome']").val(); 
dados.Email = $form.find("input[name='Email']").val(); 
dados.Genero = genero; 
dados.Origem = $form.find("input[name='Origem']").val(); 

$.ajax({ 
    type: "POST", 
    url: 'http://www.website.com.br/api/cadastroNewsletter', 
    data: dados, 
}).done(function() { 
    alert('E-mail cadastrado'); 
}).fail(function (XMLHttpRequest, textStatus, errorThrown) { 
    alert('E-mail já está cadastrado'); 
}) 

HTML

<form id="formDiaDosPais" action="http://www.website.com.br/api/cadastroNewsletter" method="post"> 
    <!-- EMAIL --> 
    <div> 
     <input placeholder="Digite seu email aqui" type="text" name="Email" id="email" value="" tabindex="1" /> 
    </div> 
    <!-- GENERO --> 
    <div style="margin:18px 0 0 0; font-size:14px;" class="left"> 
     <input type="radio" name="Genero" id="gender_male" tabindex="2" value="masculino" checked="checked" /> 
     <label for="sexoid1">Homem</label> 
     <input style="margin:0 0 0 5px;" type="radio" name="Genero" id="gender_female" tabindex="3" value="feminino" /> 
     <label for="sexoid2">Mulher</label> 
    </div> 
    <!-- ORIGEM E NOME --> 
    <div style="margin:18px 0 0 0; font-size:13px;" class="right"> 
     <input type="hidden" name="Origem" value="Newsletter" /> 
     <input type="hidden" name="Nome" value="" /> 
     <!-- ORIGEM --> 
     <input type="checkbox" value="Cadastrar" name="termos" id="chkterms" checked="checked" /> 
     <label for="chkterms">Li e aceito os <a href="http://www.centauro.com.br/sc/termosdeuso" target="_blank" class="link-termos">Termos</a> 
     </label> 
    </div> 
    <input type="submit" class="btn right" value="Cadastrar" class="submit"> 
</form> 
+0

你需要调用之前'$ .ajax' – Grundy

+0

我有最后一个版本的jQuery参考jQuery的补充参考: HTTP ://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js – Lucas

+0

您在哪里添加引用以及添加代码的位置? – Grundy

回答

0

如果我理解正确的,你有什么是submit按钮,如果你点击它,它会提交表单。

事实上,您在代码中的某处设置了ajax调用并不妨碍按钮提交。您必须手动防止按钮的默认行为,并发送和Ajax请求代替,像

$("input[type='submit']").click(function(e){ 
    e.preventDefault(); // prevent form submission 
    var $form = $('#formDiaDosPais'); 
    var dados = {}; 
    dados.Nome = $form.find("input[name='Nome']").val(); 
    dados.Email = $form.find("input[name='Email']").val(); 
    dados.Genero = genero; 
    dados.Origem = $form.find("input[name='Origem']").val(); 
    $.ajax({ // send ajax instead 
    type: "POST", 
    url: 'http://www.website.com.br/api/cadastroNewsletter', 
    data: dados, 
    }).done(function() { 
      alert('E-mail cadastrado'); 
    }).fail(function (XMLHttpRequest, textStatus, errorThrown) { 
      alert('E-mail já está cadastrado'); 
    }) 

}) 
+0

谢谢@Tilwin Joy – Lucas