0

プロジェクトの一部に KendoUI Grid を使用しようとしています。グリッドにバインドしたいデータ ソースには、列と他のいくつかのオプションとして必要のない余分な部分がたくさんあります。javascript からグリッドのオプションを設定できる方法はないかと思っていましたが、試してみると「データ」オプションに問題があるようです。

<div data-bind="kendoGrid: $parent.kendoGrid"></div>


....
program = ko.observable(null),
kendoGrid = { data: program.BettingInterest, sortable: true, columnMenu: true,
            columns: [{ field: 'BettingInterestProgramNumber', title: 'Post' }, 
                { field: 'PostPosition', title: 'PP' }, { field: 'MLOdd', title: 'ML' },
                { field: 'FractionalOdd', title: 'Odds' }, 'Jockey', 'Trainer', 'Owner', 
                { field: 'WeightCarried', title: 'Weight' }, { field: 'Medication', title: 'Med' },
                { field: 'ClaimingPrice', title: 'Claiming' }, 'Breed'], 
            scrollable: false, resizable: true
        },
....

「プログラム」は、一連のカスケード ドロップ ダウンの最後の後に入力されます。私のグリッドには、列などが表示されますが、実際のデータは表示されません。私は何か単純なものを見逃しているのではないかと思っています...

4

1 に答える 1

2

これがバインディングでプロパティを機能させるには、依存関係を適切に追跡できるように、現在のプログラムの BettingInterest を表す計算済みを作成する必要があります。ビューモデルは次のようになります。

var ViewModel = function() {
    this.program = ko.observable();
    this.programBettingInterest = ko.computed(function() {
       var program = this.program();
        return program ? program.BettingInterest : [];        
    }, this);

    this.myGrid = { data: this.programBettingInterest, sortable: true, columnMenu: true,
        columns: [{ field: 'propA', title: 'propertyA' }, 
            { field: 'propB', title: 'propertyB' }], 
        scrollable: false, resizable: true
    };
};

サンプルはこちら: http://jsfiddle.net/rniemeyer/eqVWs/

于 2012-11-06T00:01:15.203 に答える