4

ASP.Net MVC 3 +ノックアウト-2.1.0に取り組んでおり、koGridをレンダリングしようとしていますが、koGridを更新する代わりに空にするAjaxの問題があります（私たちは考えています）。

初期状態では、koGridのデータソースは2行の配列であり、これはViewModel（vm）です。

var viewModel = function() {
    var self = this;
    self.radioSelectedOptionValue = ko.observable('-1');
    self.AvailableActiveProducts = ko.mapping.fromJS(availableActiveProductsObject);
};
ko.applyBindings(new viewModel());

AvailableActiveProductsは、グリッドのデータソースです。これはhtmlです：

<div data-bind="koGrid: { data: AvailableActiveProducts }" />

そして、グリッドは最初はうまくレンダリングされます：

IMG

問題はここから始まります。radioSelectedOptionValueが変更されると（ラジオボタンコントロールの変更で変更されます）、グリッドは更新される必要がありますが、空になります。

IMG

ラジオボタンは、ノックアウトサブスクライブ関数呼び出しで更新/変更されると予想されます。

self.radioSelectedOptionValue.subscribe(function() {
    $.get('/SalesOrderManagement/GetProductsBySelection', { 
        typeCriteria: "g", id: 1, seasonType: "1" }, function(data) {
            self.AvailableActiveProducts(data.AvailableActiveProducts);
        });
    }, this);

コントローラでは、このAjax呼び出しに応答するメソッドは次のとおりです。

public JsonResult GetProductsBySelection(string typeCriteria, long id, string seasonType)
{
    var model = _orchestrator.GetProductsByUserCriteria(typeCriteria, id, seasonType);
    return Json(model, JsonRequestBehavior.AllowGet);
}

fiddlerを使用してデバッグすると、jsonオブジェクトは（予想される3行で）返されますが、呼び出し後にグリッドは空になります。

IMG

私たちの仮説は、データがobservableArrayにどのように設定されるかが問題の一部であるというものです。このアップデートを適切にレンダリング/動作させるにはどうすればよいですか？

同じ問題で苦しんでいる他の誰かを見つけたと思いますが、KOリストに応答がありませんでした：https ：//groups.google.com/forum/？fromgroups＃！topic / knockoutjs / BS4ugQfV14g

これが同じ動作を示すjsFiddleです：http：//jsfiddle.net/wabe/H4ZXM/7/

更新：解決しました！

Tyrsiusのコメントの後で、グリッドは数回クリックすると更新されることに気づきました。

したがって、ポップとプッシュを追加して（@Keithごとに）更新を強制すると、すべてが機能し、グリッドは期待どおりに更新されます。したがって、javascriptは次のように変更します。

    self.radioSelectedOptionValue.subscribe(function() {
        $.get('/SalesOrderManagement/GetProductsBySelection', { typeCriteria: "gender", id: 1, seasonType: "inseason" }, function(data) {
            self.AvailableActiveProducts(data);
            self.AvailableActiveProducts.push({});
            self.AvailableActiveProducts.pop();
        });

    }, this);

プッシュアンドポップにより、最終更新/koGridが更新されます。これはキースのフィドルです：http： //jsfiddle.net/keith_nicholas/MYYNw/

4

2 に答える 2

3

正しく更新されていないようです。一番上の列をクリックして並べ替えると、データが表示されます。

ダミーアイテムをプッシュしてポップすると、コードは期待どおりに機能するように「見えます」

http://jsfiddle.net/keith_nicholas/MYYNw/

最初のデータをマッピングしないか、両方をマッピングするか、どちらもマッピングしないため、マッピングを削除しました（実際のデータ要素の変更を観察するかどうかによって異なります）。

于 2012-07-02T22:54:52.280 に答える
1

私はこの正確な問題を抱えており、ajax呼び出し内でviewModelバインディングを移動することで回避しました。

Old＆Busted：

            var API_URL = "/api/vendor/";

            window.viewModel = {
                items: ko.observableArray([]),
                item: ko.observableArray([])
            }

            ko.applyBindings(viewModel);

            function getVendors() {
                $.ajax({
                    type: 'GET',
                    url: API_URL,
                    dataType: 'json',
                    success: function (data) {
                        newData = ko.mapping.fromJS(data);
                        viewModel.items(newData);
                    }
                });
            };

            getVendors();

新しい辛さ：

           var API_URL = "/api/vendor/";
           $.ajax({
                type: 'GET',
                url: API_URL,
                dataType: 'json',
                success: function (data) {
                    window.viewModel = {
                        items: ko.mapping.fromJS(data),
                        item: ko.observableArray([])
                    }
                    ko.applyBindings(viewModel);
                }
            });
于 2012-11-19T17:33:38.560 に答える