为什么我不能使用 ajax 将参数发送到操作方法？答案

【问题标题】：Why I can't send parameter to action method with ajax?为什么我不能使用 ajax 将参数发送到操作方法？
【发布时间】：2017-01-20 08:23:46
【问题描述】：

此代码无需发送参数即可工作：

$(function () {
        $('#Fee').on('focus', function () {
            $.ajax({
                url: '@Url.Action("GetFee")', 
                dataType: "json", 
                type: "POST",
                contentType: 'application/json; charset=utf-8', 
                cache: false, 
                data: { }, 
                success: function (data) {
                    if (data.success) {
                        $('#Fee').val(data.message);
                    }
                }
            });
        });
    });

但是，如果我想向 GetFee 操作方法发送参数，它就不再起作用了：

data: { bookname : 'book1' }

我改变了我的动作方法来接受参数：

[HttpPost]
public ActionResult GetFee(string bookname)

【问题讨论】：

删除contentType: 'application/json; charset=utf-8', 选项（您没有对数据进行字符串化）
@StephenMuecke 你能解释一下吗？
How to call c# method with no parameters and access returned data?的可能重复
@un-lucky 它是如何复制的？你甚至读过标题吗？这个问题显然是关于传递参数到一个动作方法。

标签： c# jquery asp.net-mvc

【解决方案1】：

您表示：

contentType: 'application/json; charset=utf-8',

所以请确保您尊重您声称要发送到服务器的内容：

data: JSON.stringify({ bookname : 'book1' })

另一方面，如果你在你的请求中去掉这个application/json内容类型，jQuery将默认使用application/x-www-form-urlencoded，然后你可以简单地使用这个：

data: { bookname : 'book1' }

【讨论】：

谢谢。但是 stringify 是什么意思呢？
它将您拥有的 javascript 对象 ({ bookname : 'book1' }) 序列化为 JSON 字符串："{ \"bookname\": \"book1\" }"，并通过网络发送此 JSON 字符串。当您编写 data: { bookname : 'book1' } 时，会通过网络发送以下内容：bookname=book1 如您所见，它不是有效的 JSON 字符串。请使用浏览器的内置开发人员工具栏检查发送到服务器的有效负载中这些方法之间的差异。也结帐：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

【解决方案2】：

由于您指定了数据类型“json”。因此，您只能在请求中发送 json 对象。所以需要将数据转换成json格式。

您可以使用 JSON.stringify() 方法。 JSON.stringify() 方法将 JavaScript 值转换为 JSON 字符串。

JSON.stringify(value[, replacer[, space]])

如果你不想使用 JSON 数据类型，你不需要转换它。 简单使用：

$(function () {
    $('#Fee').on('focus', function () {
        $.ajax({
            url: '@Url.Action("GetFee")', 
            type: "POST",
            cache: false, 
            data: { 
               'bookname' : 'book1'
            }, 
            success: function (data) {
                if (data.success) {
                    $('#Fee').val(data.message);
                }
            }
        });
    });
});

【讨论】：

【解决方案3】：

正如 Darin Dimitrov 之前回答的那样，您不会以您在 contentType 中声明的格式发送数据。我认为您可以选择以下两种方式：

1.将您的参数发送为 JSON 字符串（查看 Darin Dimitrov 的回答）并在输入参数前添加 [FromBody]，以明确您要读取此值的位置。

[HttpPost]
 public ActionResult GetFee([FromBody] string bookname)

2.避免在你的ajax调用中指定contentType和dataType，像这样

$(function () {
    $('#Fee').on('focus', function () {
        $.ajax({
            url: '@Url.Action("GetFee")',                 
            type: "POST",                
            cache: false, 
            data: { bookname : 'book1' },
            success: function (data) {
                if (data.success) {
                    $('#Fee').val(data.message);
                }
            }
        });
    });
});

【讨论】：