3

slickgrid で Knockout を使用すると、行を追加して正しく機能させることができますが、個々のプロパティの編集を機能させることができません。次のエラーがスローされます。

Uncaught TypeError: Property 'ProductName' of object #<Product> is not a function

オブジェクトのプロパティでオブザーバブルを使用しているため、データのラップを解除して値を再設定した場合にのみ、表示する正しい値を取得できました。

 var data = ko.utils.unwrapObservable(settings.data);
    $.each(data, function(index, item) {
        var prop;

        for (prop in item) {
            if (item.hasOwnProperty(prop)) {
                data[index][prop] = ko.utils.unwrapObservable(data[index][prop]);
            }
        }

    });

    var columns = ko.utils.unwrapObservable(settings.columns);
    var options = ko.utils.unwrapObservable(settings.options) || {};
    grid = new Slick.Grid(element, data, columns, options);

そして、編集機能は私のビューモデルにあります:

function ViewModel(data) {
var self = this;

self.gridData = ko.observableArray(data);
self.columns = [
    {
    name: 'Product ID',
    id: 'ProductId',
    field: 'ProductId'},
{
    name: 'Color',
    id: 'ColorName',
    field: 'ColorName'},
{
    name: 'Sku',
    id: 'Sku',
    field: 'Sku'},
{
    name: 'Product Name',
    id: 'ProductName',
    field: 'ProductName'}
];


self.fnTestClickEdit = function() {
    self.gridData()[0].ProductName("Product has been Edited " + new Date());
};

}

しかし、私がこれで行き止まりになっているのを見て、ここでの実装で露骨に間違ったことをしていますか?

これをすべてまとめた jsFiddle を次に示します。

http://jsfiddle.net/sbrqB/3/

4

1 に答える 1

0

あなたはKoGridをチェックアウトするかもしれません

彼らのページによると：

KoGrid は、MVVM/Knockout スタイルの開発用に構築されたまともなデータグリッドが必要だったために生まれました。SlickGrid からかなりのインスピレーションとアーキテクチャを引き出していますが、それでも全体を通して KO です。

私はまだ試していませんが (プロジェクトはまだアルファ版です)、KO アプリケーションに統合する方がはるかに簡単だと思います。

于 2012-07-29T19:20:46.037 に答える