在Knockoutjs中动态添加行

时间:2019-06-20 09:59:05

标签: c# jquery asp.net knockout.js knockout-3.0

我正在使用淘汰赛,并且我有2列资格列表和标记。单击添加按钮后,我要生成新行,单击提交按钮后,它需要显示所选的资格列表和我的分数。

我在这里有代码:https://jsfiddle.net/wg3t172b/

self.QualificationLists = ko.observableArray([
      { QualName: 'Master', QualId: '0' },
      { QualName: 'Bachelor', QualId: '1' },
      { QualName: 'CA', QualId: '2' },
      { QualName: 'School Leaving', QualId: '3' }
  ]);
  self.addQualification = function () {
      self.Qualifications.push({
         QualList: "",
         QualificationLists: "",
         Marks: "",
         selectedQualName: "",
    });
  };

  self.removeQual = function (Qualification) {
     self.Qualifications.remove(Qualification);
 };

  self.save = function (form) {
     console.log(self.Qualifications());
  };
};

var viewModel = new QualificationModel();
ko.applyBindings(viewModel);

当我进行资格认证时,它仅显示标记,但是我的预期结果应该是QualId,QualName和标记在一个阵列中。

1 个答案:

答案 0 :(得分:0)

要修复您选择的范围。使用$parent从您的foreach绑定内的上下文中移出一个范围。

<select data-bind="options: $parent.QualificationLists, optionsText:'QualName',

编辑:进行澄清。当您处于foreach绑定中时,当前作用域就是迭代中的当前项。由于您的QualificationLists直接在您的视图模型上,而不是实际上在您要遍历的项目上,因此您必须从父上下文中调用它