嵌入在koGrid中的下拉列表无法正常工作

时间:2014-10-13 12:39:06

标签: javascript knockout.js single-page-application kogrid

我正在尝试获取一个下拉列表,以填充koGrid的每一行。这是jsFiddle to illistrate(注意下拉框中没有文字) -     http://jsfiddle.net/wood0615/sorg9na0/2/

这是我的HTML -

     <table border="0" style="width: 100%;">
    <tr>           
       <td colspan="6">
            <div class="gridStyle" data-bind="koGrid: gridOptions">&nbsp;</div>
       </td>

    </tr>
</table>

我的观点模型 -

 function mainVm(){
this.WQOptions = ko.observableArray( [
                { decision: 'Approve', decisionValue: '10' },
                { decision: 'Pend', decisionValue: '5' }
    ]);

this.myData = ko.observableArray([
                { name: 'Jack Frost', age: '30' },
                { name: 'John Doe', age: '50' }]);

this.gridOptions = { 
    data: this.myData,
    autogenerateColumns: false,
    columnDefs: [
        {
            field: "name", 
            displayName: "Name"
        },
        {
            displayName: "Decision",
            cellTemplate: "<select id='Select6' data-bind=\" options: $parent.entity.WQOptions, optionsValue: $data.decisionValue, optionsText: $data.decision \"></select>"
        }

    ]
};
 };

 ko.applyBindings(new mainVm());

关于为什么下拉框在没有数据时为空的想法?

1 个答案:

答案 0 :(得分:1)

要访问用于构建网格的视图模型,您应该使用$userViewModel

cellTemplate: "<select id=\"Select6\" \
                       data-bind=\" options: $userViewModel.WQOptions, \
                                    optionsValue: 'decisionValue', \
                                    optionsText: 'decision' \"> \
               </select>"