2015-12-23 72 views
1

我想一個FormCollection發送到動作在我的控制器,但動作永遠不會被擊中。Ajax調用不打控制器動作

形式:

<form class="form-horizontal" role="form" id="TestForm" onsubmit="return false"> 
<div class="row"> 
    <div class="col-md-12"> 
     <div class="form-group"> 
      <input type="text" name="Blah1" /> 
      <input type="text" name="Blah2" /> 
     </div> 
     <input id="SubmitButton" type="submit" value="Submit" /> 
    </div> 
</div> 

的jQuery/AJAX:

$(document).ready(function() { 
    $("#SubmitButton").click(function() { 
     var form = $("#TestForm").serialize(); 


     $.ajax({ 
      url: "/Calculator/Post", 
      type: "POST", 
      data: form, 
      dataType: 'json', 
      success: function() { 
       alert("Success"); 
      }, 
      error: function() { 
       alert("Error"); 
      } 
     }); 
    }); 
}); 

控制器動作:

[HttpPost] 
public JsonResult Post(FormCollection form) 
{ 
    return Json(new { success = true }, JsonRequestBehavior.AllowGet); 
} 

出現這種情況是瀏覽器的唯一的事提醒錯誤信息。我是否錯過了導致行動永遠不會被打的東西?

回答

0

您的代碼應該正常工作,因爲發佈在問題中。唯一的問題是看你是如何手動建立網址,有時可能會導致404問題取決於你當前的網址/頁面。你應該使用Url.Action helper方法來構建您目前在該網頁將採取不分建設的正確相對URL照顧的URL。

serialize()方法是不夠好,把你的表單數據。它應該工作正常(繼續嘗試)。您無需撥打serializeArray,然後根據接受的答案建議將其串聯起來!

如果你正在在外部js文件這個Ajax調用,您可以考慮基本URL傳遞給js文件,並以此作爲在this answer描述建立相對URL到你的操作方法。

而且,在你的操作方法,你不需要到JsonRequestBehavior.AllowGet參數傳遞給Json方法,動作方法被標記爲[HttpPost]

[HttpPost] 
public JsonResult Post(FormCollection form) 
{ 
    var item =form["Blah1"]; 
    return Json(new { success = true }); 
} 
+1

謝謝你這個答案。你是對的,它工作得很好,而不必使用'serializeArray()'。無論出於何種原因,手動url都會導致錯誤。 – Quiver

1

.serialize()方法以標準的URL編碼表示法創建一個文本字符串。serializeArray()方法創建一個JavaScript對象數組,準備編碼爲JSON字符串。

var form = JSON.stringify($("#TestForm").serializeArray()); 
0

確保您的控制器的操作方法或方法的參數的數據類型與正在發佈的變量的數據類型相同。

實施例:

這不會因爲在控制器中的InsertScore方法接收炭作爲回答數據類型,但我們正在發送「ABC」這不是一個字符,因爲炭化長度爲2字節,以便唯一「A」的工作或'ab'可以在這種情況下發送。

阿賈克斯帖子:

  $.ajax({ 
        type: 'POST', 
        url: '/Home/InsertScore', 
        data: { Email: Em, Row: i, Answer: 'age' } 
       }); 

控制器:

[HttpPost] 
    [WebMethod] 
    public void InsertScore(string Email ,string Row,char Answer) 
    { 
    //do something here 
    } 

正確的方法是。

阿賈克斯帖子:

 $.ajax({ 
       type: 'POST', 
       url: '/Home/InsertScore', 
       data: { Email: Em, Row: i, Answer: 'a' } 
      }); 

控制器:

[HttpPost] 
    [WebMethod] 
    public void InsertScore(string Email ,string Row,char Answer) 
    { 
     //do something here 
    }