0

我有一个名为simpleSearchResultsArray的 observableArray ，其中包含数据，数组gridOptions包含表头名称。相同的代码位于：http: //jsfiddle.net/FENuV/8/

视图代码：

<table id="resultTableBody">

    <thead id="resultTableHeader">
        <tr style="text-align: center" data-bind="foreach: columns">
            <th style="text-align: center" data-bind="visible: checked, text: header">
            </th>
        </tr>
    </thead>

    <tbody  data-bind="foreach: simpleSearchResultsArray">
        <tr data-bind="foreach: $parent.gridOptions.columns">
            <td  data-bind="text: $parent[dataMember], visible:checked">
            </td>
        </tr>
    </tbody>

</table>

查看型号代码：

function QuoteSimpleSearchVM() {
    var self = this;

        self.gridOptions = {
        columns: [{
            header: 'Index',
            dataMember: 'index',
            checked: ko.observable(true)
        }, {
            header: 'Job Name',
            dataMember: 'jobName',
            checked: ko.observable(true)
        }, {
            header: 'Quote Name',
            dataMember: 'quoteName',
            checked: ko.observable(true)
        }, {
            header: 'Quote Number',
            dataMember: 'quoteNumber',
            checked: ko.observable(true)
        }, {
            header: 'Bid date',
            dataMember: 'bidDate',
            checked: ko.observable(true)
        }, {
            header: 'Last modified',
            dataMember: 'lastModified',
            checked: ko.observable(true)
        }, {
            header: 'Document Type',
            dataMember: 'docType',
            checked: ko.observable(true)
        }, {
            header: 'Status',
            dataMember: 'status',
            checked: ko.observable(true)
        }, {
            header: 'View',
            dataMember: 'view',
            checked: ko.observable(true)
        }
       ]
    };

    self.simpleSearchResultsArray={
        Result:[{
        bidDate: "07/11/2013",
        docType: "QUOTE",
        index: 1,
        jobName: "MobileTestingReportGenerationJob",
        lastModified: "07/11/2013",
        quoteName: "MobileFunctionalQuote",
        quoteNumber: "ftcc06000_06241300_01_00_O00",
        status: "Pending Quote Approval" 
        }, {
        bidDate: "08/28/2012",
        docType: "QUOTE",
        index: 2,
        jobName: "_Aug28th_GLOBAL_CHANGE",
        lastModified: "07/11/2013",
        quoteName: "32259_Purify",
        quoteNumber: "ftfs04000_08281200_07_00_O00",
        status: "Draft"
        }
    ]};
}

$(document).ready(function () {
    var tempVM= new QuoteSimpleSearchVM();
    ko.applyBindings(tempVM.gridOptions, document.getElementById("resultTableHeader"));
    ko.applyBindings(tempVM.simpleSearchResultsArray, document.getElementById("resultTableBody"));
});

我收到绑定错误。谁能帮我解决问题？

提前致谢。

4

2 回答 2

1

您不需要调用 ko.applyBindings 两次。在父节点上调用它，并在您的对象上绑定 foreach。

<tr style="text-align: center" data-bind="foreach: gridOptions.columns">

和

<tbody  data-bind="foreach: simpleSearchResultsArray.Result">

看这里

于 2013-07-12T08:20:20.220 回答
0

为什么要绑定tempVM.gridOptions节点？您必须改为绑定您的视图模型。只需添加with到<thead id="resultTableHeader" data-bind="with: gridOptions">.

看这里：http: //jsfiddle.net/kreeg/FENuV/9/

于 2013-07-12T04:34:59.537 回答