0

我精简了我的实际代码，但我无法完成这项工作。我正在使用带有内联剔除模板的 knockoutjs 和 bootstrap。我以前只是将一堆输入放在一个 div 中，但出于对齐原因，我将其更改为表格。我知道属性名称是正确的，并且 javascript 控制台根本没有显示任何错误变量或绑定问题。我将 foreach 放在 TR 标记而不是 TBODY 标记中，因为我不知道每次我会有多少个复选框，而且我不希望它们完全成行，只有一个 TR 元素和一堆 TD 单元格现在只有一个 TR 标签。我怎样才能使这项工作？

<div id="Counties" class="well well-large checkbox inline">  
    <table class="table table-condensed">
                <tbody>
                    <tr data-bind="foreach: { data: counties
                                            }">
                        <td><input type="checkbox" data-bind="attr: { value: $data.sid }" />$data.name
                        </td>
                    </tr>
                </tbody>
            </table>
</div>

这是我的视图模型：

function searchVm() {
    var self = this;
    self.counties = ko.observableArray([]); //array of jurisItem
}

function jurisItem(name, sid) {
    var self = this;
    self.name = name;
    self.sid = sid;
}

编辑 ：

我也根据 knockoutjs 文档尝试了这个，但它不起作用。我知道我可以使用 jquery 以其他方式做到这一点，但我更喜欢淘汰模板语法......

<table class="table table-condensed">
            <tbody>
                <tr>
                    <!-- ko foreach: $root.counties -->
                    <td>
                        <input type="checkbox" data-bind="attr: { value: $data.sid }" />$data.name
                    </td>
                    <!-- /ko -->
                </tr>
            </tbody>
        </table>
4

1 回答 1

0

我不确定你想做什么。我做了一些样品。

html:

<div id="Counties" class="well well-large checkbox inline">  
    <table class="table table-condensed">
        <tbody>
            <tr data-bind="foreach: counties">
                <td>
                <input type="checkbox" data-bind="attr: { value: sid }" />
                <span data-bind="text: name" />
                </td>
            </tr>
        </tbody>
    </table>
</div>

javascript:

$(function () { 
    var SearchVm = function () {
        var self = this;
        self.counties = ko.observableArray([]);
    };

    var JurisItem = function (name, sid) {
        var self = this;
        self.name = name;
        self.sid = sid;
    }

    var item1 = new JurisItem("TestName1", "TestSid1");
    var item2 = new JurisItem("TestName2", "TestSid2");

    var searchViewModel = new SearchVm();
    searchViewModel.counties.push(item1);
    searchViewModel.counties.push(item2);
    ko.applyBindings(searchViewModel);

})

这对你有用吗：

http://jsfiddle.net/PVMjy/41/

于 2013-01-23T20:16:42.163 回答