如何将javascript对象传递给C#MVC 4控制器

时间:2015-01-07 21:56:01

标签: javascript c# ajax asp.net-mvc asp.net-mvc-4

在MVC4中,如何将javascript对象传递给AJAX中的C#控制器? 最后我尝试了这个,但它没有用。

Javascript客户端:

    var myData = {Propr1: '', Propr2: ''};
    $.ajax({
        type: 'POST',
        data: JSON.stringify(myData),
        url: '/Home/SubmitMyData',
        contentType: 'application/json',
        dataType: 'json',
        success: alert('Youhou'),
        error: alert('not good')
    });

C#服务器端方法:

    public ActionResult SubmitMyData(MyParamModel myParam)
    {
        // Do my stuff here with my parameter
        return View();
    }

    public class MyParamModel
    {
        string Prop1 { get; set; }
        string Prop2 { get; set; }
    }

我的参数始终为null。我试图更改contentType但它仍然无法正常工作。 我的错误在哪里?我发现了一些帖子,但我没有找到我做错的事。

非常感谢。

2 个答案:

答案 0 :(得分:22)

  1. 确保javascript和C#模型之间的属性名称匹配。在您的问题中,javascript对象有Propr1Propr2,但在C#模型中,您有Prop1Prop2(缺少“r”)。
  2. 发送前不要stringify数据,也不要将dataType设置为json。 MVC可以使用一组post参数进行解析,而不需要在代码中使用json序列化。
  3. 省略contentType,没有必要。 WebAPI应该自动检测这个。你可以离开它,但这是无关紧要的。
  4. 确保模型属性是公开的。
  5. Javascript客户端:

        var myData = {Prop1: '', Prop2: ''}; // #1
        $.ajax({
            type: 'POST',
            data: myData, // #2
            url: '/Home/SubmitMyData',
            //contentType: 'application/json', #3
            //dataType: 'json', #2
            success: alert('Youhou'),
            error: alert('not good')
        });
    

    C#服务器端方法:

        public ActionResult SubmitMyData(MyParamModel myParam)
        {
            // Do my stuff here with my parameter
            return View();
        }
    
        public class MyParamModel // #4
        {
            public string Prop1 { get; set; }
            public string Prop2 { get; set; }
        }
    

答案 1 :(得分:1)

您为data属性传递的值应该是对象,而不是字符串:

data: myData,

属性名称需要匹配:

var myData = { Prop1: '', Prop2: ''};

您需要在参数值上使用[FromBody]属性:

public ActionResult SubmitMyData([FromBody] MyParamModel myParam)

并且模型类型的属性必须为public

public class MyParamModel
{
    public string Prop1 { get; set; }
    public string Prop2 { get; set; }
}