内部对象未在MVC控制器调用中填充

时间:2016-12-02 10:17:36

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

我有一个在我的javascript中声明的对象,我想发送给我的控制器。该对象的类型为VMInterface,如下所示:

public class VMInterface
{
    public string Name { get; set; }
    public int SourceID { get; set; }
    public int ProjectID { get; set; }
    public string Description { get; set; }
    public VMConnection VMConnection { get; set; }
    public List<VMInteraction> Interactions { get; set; }

}

public class VMConnection
{
    public string Username { get; set; }
    public string Password { get; set; }
    public string Connection { get; set; }
}

public class VMInteraction
{
    public string Name { get; set; }
    public List<VMField> Fields { get; set; }
}

public class VMField
{
    public string InputOutput { get; set; }
    public string Name { get; set; }
    public int DataTypeID { get; set; }
}

我的控制器:

[HttpGet]
public JsonResult UpdateVM(VMInterface vm)
{
    return null;
}

我打电话给控制器:

$.ajax({
    url: '/Admin/UpdateVM',
    type: 'GET',
    data: {
        Name: "Test Name",
        Description: "Test Desc",
        SourceID: 1,
        ProjectID: 4,
        VMConnection: {
            Connection: "IPAddress goes here",
            Username: "Username",
            Password: "Password"
        },
        Interactions: [{
            Name: "Method",
            Fields: [{
                InputOutput: "INPUT OR OUTPUT HERE",
                Name: "DROP LOCATION HERE",
                DataTypeID: 1
            }],

        }]
    },
    success: function (response) {
        //Do nothing
    }
});

我已经仔细检查了所有字段名称是否匹配,并且VMInterface类中的属性都是{ get; set; }公开的。我的呼叫正在按下我的控制器,所有顶级(ei NameDescriptionSourceIDProjectID)字段都正确映射。但是,对于我的VMConnectionInteractions字段,信息未填充。

enter image description here enter image description here

为了正确映射这些映射,我有什么遗漏吗?

2 个答案:

答案 0 :(得分:1)

因为您要将数据发送到GET方法,所以必须生成值作为查询字符串,这意味着名称/值对必须与您的模型结构匹配。属性名称必须与用于访问服务器中的属性的点符号相同。

如果您希望在POST方法的第一个InputOutput的第一个VMField中获得VMInteraction的值,则可以使用

var value = vm.Interactions[0].Fields[0].InputOutput

由于参数的名称是vm,因此只需删除该前缀,这就是数据需要的方式,因此ajax调用将是

$.ajax({
    ....
    data: {
        Name: "Test Name",
        Description: "Test Desc",
        ....
        VMConnection.Connection: "IPAddress goes here",
        VMConnection.Username: "Username",
        ....
        Interactions[0].Name: "Method",
        Interactions[0].Fields[0].InputOutput: "INPUT OR OUTPUT HERE",
        ....
    },

请注意,这会创建一个丑陋的查询字符串,并且存在超出查询字符串限制并抛出异常的风险,因此使用type: 'Post',并标记方法[HttpPost]会更多合适的。

另一种方法是按原样使用您的javascript对象,对其进行字符串化,并将其作为contentType: 'application/json'发送。这意味着它必须是POST,因为GET没有正文。你的ajax电话将是

$.ajax({
    url: '/Admin/UpdateVM',
    type: 'Post', // must be a post
    contentType: 'application/json;charset=utf-8', // set contentType
    data: JSON.stringify(vm : { // stringify the data
        Name: "Test Name",
        Description: "Test Desc",
        SourceID: 1,
        ProjectID: 4,
        VMConnection: {
            Connection: "IPAddress goes here",
            Username: "Username",
            Password: "Password"
        },
        Interactions: [{
            Name: "Method",
            Fields: [{
                InputOutput: "INPUT OR OUTPUT HERE",
                Name: "DROP LOCATION HERE",
                DataTypeID: 1
            }],

        }]
    }}),

并将方法更改为[HttpPost]

答案 1 :(得分:0)

尝试这样。

操作方法:(HttpGet到HttpPost)

 [HttpPost]
 public JsonResult UpdateVM(VMInterface vm)
 {
       return null;
 }

<强>使用Javascript:

  var myData = {
            Name: "Test Name",
            Description: "Test Desc",
            SourceID: 1,
            ProjectID: 4,
            VMConnection: {
                Connection: "IPAddress goes here",
                Username: "Username",
                Password: "Password"
            },
            Interactions: [{
                Name: "Method",
                Fields: [{
                    InputOutput: "INPUT OR OUTPUT HERE",
                    Name: "DROP LOCATION HERE",
                    DataTypeID: 1
                }],

            }]
        }

  $.ajax({
            url: '/Admin/UpdateVM',
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            type: "POST",
            data: JSON.stringify(myData),                   
            success: function (response) {
                //Do nothing
            }
        });

它工作得很好!!!!!!!