2

私はあなたの考慮のために、このフィドルを提出します:http: //jsfiddle.net/alexdresko/HFFUL/5/

HTMLには2つの同一のグリッドがありますが、[ロード]ボタンをクリックすると、そのうちの1つだけが表示されます。

これは私自身のノックアウトの根本的な誤解によるものですか、それともjqxgridの問題ですか?

コードは次のとおりです。

<a href="#" data-bind="click: load">Load</a>

<div class="aGrid" data-bind="jqxGrid: { source: Stuff().People, columns: [ {text: 'Name', datafield: 'Name'} ], autoheight: true, sortable: true, altrows: true, enabletooltips:true }"></div>
<div class="aGrid" data-bind="jqxGrid: { source: Stuff().People, columns: [ {text: 'Name', datafield: 'Name'} ], autoheight: true, sortable: true, altrows: true, enabletooltips:true }"></div>

var dataFromServer = {
    People: ko.observableArray([{
        Name: "George"
    }, {
        Name: "Scot"
    }])
};

var viewModel = function () {

    this.Stuff = ko.observable({});
    this.load = function () {
        this.Stuff(dataFromServer);

    };
};

$(function () {
    var vm = new viewModel();
    ko.applyBindings(vm);
});
4

2 に答える 2

2

ここでobservableのsource : Stuff().Peopleを明示的に取得し、そのプロパティにアクセスするため、問題はどこかにあります。それ自体を変更しても、このバインドされた監視可能な配列は変更されません。StuffPeopleStuff

dataFromServerただし、全体的にもっとゆるい解決策があり、それ自体を観察可能にする必要もありません。

HTML:

<a href="#" data-bind="click: load">Load</a>

<div class="aGrid" data-bind="jqxGrid: { source: Stuff.People, columns: [ {text: 'Name', datafield: 'Name'} ], autoheight: true, sortable: true, altrows: true, enabletooltips:true }"></div>
<div class="aGrid" data-bind="jqxGrid: { source: Stuff.People, columns: [ {text: 'Name', datafield: 'Name'} ], autoheight: true, sortable: true, altrows: true, enabletooltips:true }"></div>

JavaScript:

var dataFromServer = [{
        Name: "George"
    }, {
        Name: "Scot"
    }];

var viewModel = function () {

    this.Stuff = { People: ko.observableArray([]) }
    this.load = function () {
        for (i=0; i < dataFromServer.length; ++i) {
            this.Stuff.People.push(dataFromServer[i]);
        }

    };
};


$(function () {

    var vm = new viewModel();
    ko.applyBindings(vm);

});

フォークされたJSFiddle

于 2013-02-06T14:45:18.703 に答える
0

原因はわかりませんが、2 つのグリッドを次のように div でラップしたとき:

<div data-bind="if: Stuff().People">

うまくいきました。もちろん、これにより、ロードをクリックするまでグリッドが完全に非表示になります。

フィドル

于 2013-02-06T14:17:29.397 に答える