Question

function myItemsViewModel(ItemID, GroupID, ItemName, Quantity) {
this.ItemID = ItemID;
this.GroupID = GroupID;
this.ItemName = ItemName;
this.Quantity = Quantity;

}

我有以下代码发布到控制器

 var CreateRecord = function () {
    var Name = $.trim($("#divCreate").find("#txtName").val());
    var Department  = $.trim($("#divCreate").find("#txtDepartment").val());

    var ItemsList = [];
    $('#myDynamicTable').find('tr').each(function () {
        var row = $(this);
        var itemName = $.trim(row.find(".itemName input").val());
        var itemQty = $.trim(row.find(".itemQty input").val());

        var myItems = new myItemsViewModel("", "", itemName, itemQty);
        ItemsList.push(myItems);
    });

    var obj = new myRecordEntryViewModel("", Name, Department, ItemsList);
    var viewmodel = JSON.stringify(obj);    
                $.ajax({
                    type: 'POST',
                    cache: false,
                    dataType: 'html',
                    data: viewmodel,
                    headers: GetRequestVerificationToken(),
                    contentType: 'application/json; charset=utf-8',
                    url: '/' + virtualDirectory + '/RecordEntry/Save',
                    success: function (data) {
                        $("#divMaster").html(data);
                        return false;
                    },
                    error: function (msg) {
                        alert("Error Submitting Record Request!");
                    }
                });
            }

在第var viewmodel = JSON.stringify(obj);行，viewmodel拥有我想要的ItemsList数组变量中的所有值。

问题是我的ItemsList数组在控制器中变为null。姓名和部门正在通过正确的传递值。

以下是我的控制器代码。

类

 public class myRecordEntryViewModel 
    {
        public  long ID { get; set; }
        public  string Name { get; set; }
        public string Department { get; set; }
        public string[] ItemsList { get; set; }
    }

保存操作

    [ActionName("Save")]
    [NoCache]
    public ActionResult Save(myRecordEntryViewModel viewModel)
    {
            //here viewModel.ItemsList is null, what could i be missing
            if (this.SaveEntry(viewModel.Name,viewModel.Department,viewModel.ItemsList))
            {

            }
        return this.View();
    }

我想知道为什么viewModel.ItemsList在控制器中为null，但它在jQuery的帖子中有值。

Answer 1

您的代码中有几个问题......

1）你班级的ItemList和你的javascript代码不一样 - 第一个是字符串数组，第二个是对象数组

2）在您的操作方法中，您应该更改参数类型，如下所示：

public ActionResult Save(string viewModel)

3）在action方法的主体中，你应该反序列化json字符串（viewModel）并从中创建模型对象。以下是一个例子......

https://stackoverflow.com/a/17741421/1814343

Answer 2

您应该为项目列表中的项目（在C＃中）创建一个类

public class Item {
    public string ItemName { get; set; }
    public int Quantity { get; set; }
}

然后更改viewmodel类

 public class myRecordEntryViewModel 
{
    public  long ID { get; set; }
    public  string Name { get; set; }
    public string Department { get; set; }
    //public string[] ItemsList { get; set; }
    public List<Item> ItemsList {get ; set;}
}

控制器无法将您的请求中的项目列表映射到模型中，因为一个是字符串列表，另一个是对象列表。

Answer 3

尝试以下代码，看看您的模型是否获得了值。 如果您遇到任何问题，请告诉我，因为我已经在我的某个项目中实施了这个问题

var CreateRecord = function () {
    var Name = $.trim($("#divCreate").find("#txtName").val());
    var Department  = $.trim($("#divCreate").find("#txtDepartment").val());
    var model="";
    var ItemsList = [];
    $('#myDynamicTable').find('tr').each(function () {
        var row = $(this);
        var itemName = $.trim(row.find(".itemName input").val());
        var itemQty = $.trim(row.find(".itemQty input").val());

        var myItems = new myItemsViewModel("", "", itemName, itemQty);
        ItemsList.push(myItems);
    });
    model = ['Name' : Name , 'Department' : Department , 'ItemsList' :ItemsList];
       $.ajax({
                    type: 'POST',
                    cache: false,
                    dataType: 'html',
                    data: JSON.stringify(model),
                    headers: GetRequestVerificationToken(),
                    contentType: 'application/json; charset=utf-8',
                    url: '/' + virtualDirectory + '/RecordEntry/Save',
                    success: function (data) {
                        $("#divMaster").html(data);
                        HideLoader();
                        return false;
                    },
                    error: function (msg) {
                        alert("Error Submitting Record Request!");
                        HideLoader();
                    }
                });
            }

使用jQuery将视图中的数组发布到控制器

3 个答案: