2014-07-18 197 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