代码之家  ›  专栏  ›  技术社区  ›  kaka1234

淘汰JS:从viewmodel observable数组创建Json

  •  1
  • kaka1234  · 技术社区  · 8 年前

    我有一个html表,其列是动态创建的。“添加行”按钮用于将行添加到表中,而“删除行”按钮用于删除行。 最后还有一个保存按钮,我想从输入的表中获取所有数据,并将其以json格式发送到我的mvc控制器。

    桌子的设置都很好。我面临的唯一问题是从可观察数组创建json。 下面是我的小提琴:

    https://jsfiddle.net/4djn2zee/1/

    如果单击“添加一行或多行”,并在两行中输入数据。如果按“保存”按钮,则可观察到:

    self.valuesData()
    

    现在,如果您在控制台中看到,其值为:

    (2) [ValuesData, ValuesData]
    

    进一步扩展:

    (2) [ValuesData, ValuesData]
    0:ValuesData {ID: "1", Co1: "2", Col2: "3", Col3: "4", Col4: "5", …}
    1:ValuesData {ID: ƒ, Co1: ƒ, Col2: ƒ, Col3: ƒ, Col4: ƒ, …}
    length:2
    __proto__:Array(0)
    

    因为我添加了2行,所以可以看到一个2行的数组。

    现在,如果您看到上面的内容,我可以在第一行id、col1、col2等中看到我的数据。 我遇到的问题是如何从可观察对象获取数据并构建json。

    我希望我的json如下所示:

    {
    "ID": "1",
    "Co1": "2",
    "Col2": "3",
    "Col3": "4",
    "Col4": "5",
    "Col5": "6",
    "Comment": "7"
    },
    {
    "ID": "8",
    "Co1": "9",
    "Col2": "10",
    "Col3": "11",
    "Col4": "12",
    "Col5": "13",
    "Comment": "14"
    }
    

    更新日期:

    我尝试了以下方法:

        var dataToSave = $.map(self.valuesData(), function(item) {
        var jsonToSend = {};
    
    
    
        return jsonToSend;
      });
    

    正如第一行所述,我可以看到数据,但不确定如何从第二行和后续行获取数据。

    这是我最新的小提琴:

    https://jsfiddle.net/4djn2zee/3/

    1 回复  |  直到 8 年前
        1
  •  1
  •   tomasantunes    8 年前

    尝试以下操作:

    var dataToSave = ko.toJSON(self.valuesData);