使用jQuery构建C＃视图模型

如何解决使用jQuery构建C＃视图模型

我有一个视图模型，并将该视图模型传递给控制器​​，但是模型属性之一是其他类的列表。所以我无法通过jQuery绑定它。

我有以下视图模型。

public class ToolsAddviewmodel
{
        public string Tools_Name { get; set; }
        public string Tools_Desc { get; set; }
        public int Category_ID { get; set; }
        public List<ToolsParamsBlockviewmodel> Params_List { get; set; }
}

用作列表类型的ToolsParamsBlockviewmodel类

public class ToolsParamsBlockviewmodel
{
        public int Params_ID { get; set; }
        public string Params_CSS_Attribute { get; set; }
        public int Params_Priority { get; set; }
}

这是我的用于处理viewmodel数据的控制器方法

[HttpPost]
public ActionResult Manage(ToolsAddviewmodel toolsAddviewmodel)
{
    //insert viewmodel data into database 
    return RedirectToAction("Index","Tools");
}

，最后我尝试使用jQuery将数据添加到viewmodel中，就在这里。我使用表格将列表添加到Params_List属性中。

$("#btnSave").on("click",function () {
        var ParamsList = [];
        $('#paramsBlockTable tbody > tr').each(function () {
                var SingleParams = [];
                $(this).find("input,select").each(function () {
                    SingleParams.push($(this).val());
                    console.log(values);
                });
                ParamsList.push(values);
        });
        var ToolsModel = {
                "ID": $("#ID").val(),"Tools_Name": $("#Tools_Name").val(),"Category_ID": $("#Category_ID").val(),"Params_List": ParamsList,"ScriptFiles_IDs": $("#ScriptFiles_IDs").val(),"Tools_SEO_Keyword": $("#Tools_SEO_Keyword").val(),"Tools_Desc": $("#Tools_Desc").val(),}
        console.log(ToolsModel);
});

在ParamsList中具有表行元素的数组，但我需要将其转换为视图模型格式。 预先感谢

解决方法

感谢phuzi对我的帮助：）

在这里我更改了一些代码块。

$("#btnSave").on("click",function () {
    var ParamsList = [];
    $('#paramsBlockTable tbody > tr').each(function () {
        let SingleParams = {
            Params_ID: $(this).find(".params-id").val(),Params_CSS_Attribute: $(this).find(".params-attribute").val(),Params_Priority: $(this).find(".params-priority").val()
        }
        ParamsList.push(SingleParams);
    });

    var ToolsModel = {
        "ID": $("#ID").val(),"Tools_Name": $("#Tools_Name").val(),"Category_ID": $("#Category_ID").val(),"Params_List": ParamsList,"ScriptFiles_IDs": $("#ScriptFiles_IDs").val(),"Tools_SEO_Keyword": $("#Tools_SEO_Keyword").val(),"Tools_Desc": $("#Tools_Desc").val(),}
    console.log(ToolsModel);
});