jQuery Ajax调用 - 数据参数未传递到MVC控制器操作

Question

我从jQuery ajax调用中传递了两个字符串参数到一个MVC控制器方法，并期望获得一个JSON响应。我可以看到客户端上填充了这些参数，但服务器端的匹配参数为null。

以下是javascript代码：

$.ajax({  
  type: "POST",  
  contentType: "application/json; charset=utf-8",  
  url: "List/AddItem",  
  data: "{ ListID: '1', ItemName: 'test' }",  
  dataType: "json",  
  success: function(response) { alert("item added"); },  
  error: function(xhr, ajaxOptions, thrownError) { alert(xhr.responseText); }
});

以下是控制器方法：

Function AddItem(ByVal ListID As String, ByVal ItemName As String) As JsonResult
   'code removed for brevity
   'ListID is nothing and ItemName is nothing upon arrival.
   return nothing
End Function

我做错了什么？

- Grant

---

不应该是 data: { ListID: '1', ItemName: 'test' }, 吗？没有双引号。 - LukLed

LukeLed是正确的：你传递了一个字符串而不是一个对象。去掉双引号，一切都会好的。 - pixeline

谢谢回复。我尝试去掉双引号，但结果相同。 - Grant

@Grant: 你移除了 contentType 吗？带上 contentType 它就能工作。 - LukLed

Answer 1

我尝试了：

<input id="btnTest" type="button" value="button" />

<script type="text/javascript">
    $(document).ready( function() {
      $('#btnTest').click( function() {
        $.ajax({
          type: "POST", 
          url: "/Login/Test",
          data: { ListID: '1', ItemName: 'test' },
          dataType: "json",
          success: function(response) { alert(response); },
          error: function(xhr, ajaxOptions, thrownError) { alert(xhr.responseText); }
        });
      });
    });
</script>

并且是 C#：

[HttpPost]
public ActionResult Test(string ListID, string ItemName)
{
    return Content(ListID + " " + ItemName);
}

成功了。删除contentType并且将data设置为不带双引号的内容。

- LukLed

---

谢谢回复。我尝试了这个方法，但是得到了相同的结果。可能是我的web.config文件中有一些设置不正确的地方吗？ - Grant

@Grant：你移除了contentType吗？有了contentType它就无法工作。 - LukLed

我从数据参数中删除了contentType和双引号，但是没有成功。 - Grant

LukLed，感谢您的帮助。删除contentType就解决了问题。第一次尝试没有contentType时，我仍然得到了null值，但可能是因为我没有刷新所有内容，因为这解决了问题。但是为什么会这样呢？我看过发布的内容，必须按此设置contentType才能正常工作。（请参见http://encosia.com/2008/03/27/using-jquery-to-consume-aspnet-json-web-services/）。 - Grant

哇。有趣的是，我的值一定被缓存了，因为我现在在参数中得到了一个旧值。这一定是为什么我前几次尝试没有使用contentType时仍然得到了空值。 - Grant

我正在使用上述代码，但是我遇到了这个错误{ "Message": "请求的资源不支持 'POST' 方法。" } - Rajashree Pethkar

Answer 2

你需要添加 -> contentType: "application/json; charset=utf-8"。

<script type="text/javascript">
    $(document).ready( function() {
      $('#btnTest').click( function() {
        $.ajax({
          type: "POST", 
          url: "/Login/Test",
          data: { ListID: '1', ItemName: 'test' },
          dataType: "json",
          contentType: "application/json; charset=utf-8",
          success: function(response) { alert(response); },
          error: function(xhr, ajaxOptions, thrownError) { alert(xhr.responseText); }
        });
      });
    });
</script>

- Ahmet Onur

Answer 3

如果您在缓存ajax方面遇到了问题，可以将其关闭：

$.ajaxSetup({cache: false});

- Mocksy

---

我也有同样的问题。为什么要清除缓存？它有什么影响？在哪里写它，是在 $(document).function(){} 内部吗？ - MegaBytes

如果使用asp.net mvc，您可以在布局页面中使用一些javascript来关闭它，然后所有页面的ajax缓存都会被关闭。唯一的问题是，就像我说的那样，它会关闭所有ajax调用的缓存。相反，您可以通常指定是否要缓存单个ajax调用。它通常会在ajax请求url的末尾添加日期/时间，以便浏览器/服务器每次都认为它是一个新请求。 - Mocksy

Answer 4

  var json = {"ListID" : "1", "ItemName":"test"};
    $.ajax({
            url: url,
            type: 'POST',        
            data: username, 
            cache:false,
            beforeSend: function(xhr) {  
                xhr.setRequestHeader("Accept", "application/json");  
                xhr.setRequestHeader("Content-Type", "application/json");  
            },       
            success:function(response){
             console.log("Success")
            },
              error : function(xhr, status, error) {
            console.log("error")
            }
);

- Rakesh Haladi

---

在控制器中，我认为您需要获取单个值，例如：function Additem(var itemObject){ }，然后在函数中，您需要将字符串转换为对象。 - Rakesh Haladi

Answer 5

在我的情况下，如果我删除 contentType，我会得到 内部服务器错误。

这是我经过多次尝试后得到的结果：

var request =  $.ajax({
    type: 'POST',
    url: '/ControllerName/ActionName' ,
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify({ projId: 1, userId:1 }), //hard-coded value used for simplicity
    dataType: 'json'
});

request.done(function(msg) {
    alert(msg);
});

request.fail(function (jqXHR, textStatus, errorThrown) {
    alert("Request failed: " + jqXHR.responseStart +"-" + textStatus + "-" + errorThrown);
});

这是控制器代码：

public JsonResult ActionName(int projId, int userId)
{
    var obj = new ClassName();

    var result = obj.MethodName(projId, userId); // variable used for readability
    return Json(result, JsonRequestBehavior.AllowGet);
}

请注意，ASP.NET的情况略有不同，我们必须像update中提到的那样对数据应用JSON.stringify()。

- BiLaL

---

https://dev59.com/Xl8d5IYBdhLWcg3woDYZ - charulatha krishnamoorthy