Knockout.js Knockoutjs将复选框列动态添加到表中

我想动态地将包含复选框的列添加到表中。当前的摆弄 ，这在很大程度上是基于Ryan Niemeyer在 . 在本例中，单击“添加教师”将添加一个新行和所选教师，而单击“添加助理”将添加一列和所选助手

当我添加助手时，它会重用activeColumn可观察数组来确定是否添加可读或可写的文本输入，但我希望能够添加第三种类型的带有复选框的列，类似于复选框1列，用户可以在需要时将助手与教师相关联。复选框列将包含以下内容：

<td><input class="center" style="height:18px;"type="checkbox" value="0" /></td>

---

任何想法都将不胜感激。我考虑过可能会添加一个新的activeAssts可观察数组，比如当前的activeColumns，但它会丢失所有列。我还考虑了上述activeColumns可观察数组的附加参数，这可能会起作用，但不确定如何只添加复选框列。TIA，Steve

当您想显示复选框列时，我只会使用一个设置为true的observable。然后，您可以使用visible绑定仅在observable为true时显示复选框行

var ViewModel = function (model) {
    var self = this;

    self.rows = $.map(model.rows, function (row) { return new RowData(row); } );
    self.showCheckboxes = ko.observable(false);

    self.showCheckboxesClick = function () {
        self.showCheckboxes(true);
    };
};

var RowData = function (row) {
    var self = this;

    ko.utils.extend(self, row);    

    self.isChecked = ko.observable();
};

<button data-bind="click: showCheckboxesClick">Show checkboxes</button>
<table>
    <thead>
        <tr>
            <th>First name</th>
            <th>Last name</th>
            <th data-bind="visible: showCheckboxes"></th>
        </tr>
    </thead>
    <tbody data-bind="foreach: rows">
        <tr>
            <td data-bind="text: firstName"></td>
            <td data-bind="text: lastName"></td>
            <td data-bind="visible: $parent.showCheckboxes"><input type="checkbox" data-bind="checked: isChecked"/></td>
        </tr>
    </tbody>
</table>

var ViewModel=函数（模型）{
var self=这个；
self.rows=$.map（model.rows，函数（row）{返回新的RowData（row）；}）；
self.showcheckbox=ko.可观察（假）；
self.showcheckbox单击=函数（）{
self.showcheckbox（true）；
};
};
var RowData=函数（行）{
var self=这个；
ko.utils.extend（self，row）；
self.isChecked=ko.observable（）；
};
显示复选框
名字
姓

---

如果您修改代码，只剩下相关的部分，然后编辑问题以内联问题（这样，如果链接失效，这个问题对未来的访问者仍然有用）。感谢您的建议-下次将尝试简化。也许我应该更清楚，但您可以添加一个或多个助手，在运行时我不知道他们的名字。在真正的实现中，有部门和部门，因此我们将有大约70-80名助手在下拉列表中。然而，助理的数量永远不会超过7个，所以我可以预先构建专栏，也许只需要用所选的助理重新调整它们的标题，但我是一个优秀的新手，所以希望我能找到答案。也许这将是一个不幸的jQuery操作？例如动态构建html表-这可能是另一种选择？如何确定列的类型？听起来你好像有写、读和复选框专栏，这是一个很好的问题。实际上，仔细想想，教师ID列可以隐藏或包含在可观察数组中，只要我能唯一地识别教师，我们就可以了。教师栏实际上不需要是可写的。我只需要助手复选框列就可以被选中。这可能会更容易！鉴于此，这个更新的小提琴解决了我眼前的问题。谢谢