2015-07-01 142 views
1

我試圖驗證使用$.get請求的字段。我可以看到錯誤消息(「計劃已經存在」),但表單正在提交。我想阻止表單提交。這裏是我的代碼:返回false不阻止表單提交

$("#add_plan_subscriptions").submit(function(event) { 
    var flag = true; 
    var subdomain_val = $('[name="plan[subdomain_type_id]"]').val(); 
    var plan_val = $('[name="plan[plan_type_id]"]').val(); 
    var plan_name = $('[name="plan[plan_name]"]').val(); 
    var subdomain_type_id = subdomain_val; 
    var plan_name = $('[name="plan[plan_name]"]').val(); 
    $.get("/plans/check_duplicate_plan",{subdomain_type_id: subdomain_type_id, plan_name: plan_name}, function (response) { 
     if (response){ 
     event.preventDefault() ; 
     var element = $('[name="plan[plan_name]"]'); 
     var message = "Plan already present"; 
     addError(element,message) 
     return false; 
     } 
     else{ 
     var element = $('[name="plan[plan_name]"]'); 
     removeError(element) 
     } 
    }) 
    if(subdomain_val == ""){ 
     var element = $('[name="plan[subdomain_type_id]"]') 
     var message = "Please select user type" 
     addError(element,message) 
     flag = false; 
    } 
    if(subdomain_val != ""){ 
     var element = $('[name="plan[subdomain_type_id]"]') 
     removeError(element) 
    } 
    if(plan_val == ""){ 
     var element = $('[name="plan[plan_type_id]"]') 
     var message = "Please select plan type" 
     addError(element,message) 
     flag = false; 
    } 
    if(plan_val != ""){ 
     var element = $('[name="plan[plan_type_id]"]') 
     removeError(element) 
    } 
    if (!flag){ 
     event.preventDefault(); 
     return false; 
    } 
    return true; 
}); 
+5

這是因爲'返回在'$ .get' FALSE'被阻止返回你的匿名函數,而不是'submit'處理程序。 –

+0

提交後你有沒有試過看你的控制檯? –

回答

-1

你只是防止形式從當有應答或子提交。您需要在事件回調的頂部添加event.preventDefault()

$("#add_plan_subscriptions").submit(function(event) { 
    event.preventDefault(); 
    var flag = true; 
2

現在$.get通話中的GET表單響應之前async模式提交功能調用。 在sync模式,以便使用ajax代替$.get

  $.ajax({ 
       url: '/plans/check_duplicate_plan', 
       data: { subdomain_type_id: subdomain_type_id, plan_name: plan_name}, 
       dataType: 'json', 
       async:false, 
       type: 'GET', 
       success: function (response) { 
        if (response){ 
         event.preventDefault() ; 
         var element = $('[name="plan[plan_name]"]'); 
         var message = "Plan already present"; 
         addError(element,message) 
         return false; 
        } 
        else{ 
         var element = $('[name="plan[plan_name]"]'); 
         removeError(element) 
        } 
       } 
      }) 
+0

不推薦,jQuery的最新版本甚至已經從'$ .ajax()'中刪除同步模式。 – Teemu

1

步驟: 1.更改輸入類型提交按鈕類別 2.增加這一行,而不是真正的回報在javascript

document.forms["signup"].submit(); 

我有類似的問題。考慮這樣一個HTML ..

<form name="login" action="ValidateLogin"> 
<button id="SignIn">Login</button> 
    </form> 

然後提交您想爲什麼還要提交表單是因爲你的形式返回true

$.ajax({ 
>    type: "GET", 
>    url: "ManageForm", 
>    data: dataString, 
>    beforeSend: function() 
>    { 
> 
> 
>    }, 
>    success: function(data) 
>    { 
>     if (data == 1) 
>     { alert("data :"+data); 
>      document.getElementById("errorName").innerHTML = "Sorry! UserName Already Taken"; 
>      flag = 0; 
>      return false; 
>      
>     } 
>     else if (data == 2) 
>     { alert("data :"+data); 
>      document.getElementById("erroremail").innerHTML = "Email id Already Registered!"; 
>      flag = 0; 
>      return false; 
>     } 
>     else if (data == 3) 
>     { alert("data :"+data); 
>      document.getElementById("errorphone").innerHTML = "Phone No Already Registered!"; 
>      flag = 0; 
>      return false; 
>     } 
>     else 
>      document.forms["signup"].submit(); 
>    } 
>    
>   }); 
-1

原因在JavaScript形式在您發佈的代碼的最後兩行中,您返回true;

使其返回false;

您發佈的代碼的最後兩行是這樣

return true; 
}); 

,而不是讓它這樣

return false; 
}); 

,並嘗試刪除你的回報真實的;在該確切的行中,並將其替換爲event.preventDefault();

1

刪除您event.preventDefault() ;你的$不用彷徨函數中,並在您提交功能添加event.preventDefault() ;return false;,如果你只是想阻止的形式從提交

基於jQuery的文檔http://api.jquery.com/event.preventdefault/ event.preventDefautl();被調用時,事件的默認動作不會被觸發。因此

我們稱這種方法,您提交功能將停止觸發的默認操作

希望有助於您瞭解它:)