0

ノックアウトとajax呼び出しを介して取得したデータを使用してドロップダウンを更新しようとしています。ajax呼び出しは、更新リンクをクリックすることでトリガーされます。ページが最初にレンダリングされたときに、ドロップダウンが正常に入力されます。ただし、[更新]をクリックすると、新しいデータを再入力するのではなく、ドロップダウンがクリアされます。

HTML：

<select data-bind="options: pages, optionsText: 'Name', optionsCaption: 'Select a page...'"></select> 
<a id="refreshpage">Refresh</a>

脚本：

var initialData = "[{"Id":"231271443653720","Name":"Car2"},{"Id":"439319486078105","Name":"Electronics1.2"},{"Id":"115147185289433","Name":"Product"},{"Id":"145033098963549","Name":"Product2"}]";
var viewModel = {
    pages : ko.mapping.fromJS(initialData)
};

ko.applyBindings(viewModel);


$('#refreshpage').click(function() {
    $.ajax({
        url: "@Url.Action("GetPageList", "FbWizard")",
        type: "GET",
        dataType: "json",
        contentType: "application/json charset=utf-8",
        processData: false,
        success: function(data) {
            if (data.Success) {
                ko.mapping.updateFromJS(data.Data);
            } else {
                displayErrors(form, data.Errors);
            }
        }
    });
});

ajax呼び出しからのデータ：

{
  "Success": true,
  "Data": "[{"Id":"231271443653720","Name":"Car2"},{"Id":"439319486078105","Name":"Electronics1.2"},{"Id":"115147185289433","Name":"Product"},{"Id":"145033098963549","Name":"Product2"}]"
}

私は何が間違っているのですか？

4

1 に答える 1

0

あなたが抱えている問題は、マッピングプラグインに何をターゲットにするかを指示していないことです。渡すデータがページコレクションにマップされることになっていることをどのように知ると仮定しますか。

これは、マッピングにどのターゲットを指示するコードの簡略化されたバージョンです。

ところで、initialDataとajaxの結果は同じだったので、それが機能していれば変化に気付かなかったでしょう。

http://jsfiddle.net/madcapnmckay/gkLgZ/

var initialData = [{"Id":"231271443653720","Name":"Car2"},{"Id":"439319486078105","Name":"Electronics1.2"},{"Id":"115147185289433","Name":"Product"},{"Id":"145033098963549","Name":"Product2"}];

var json = [{"Id":"231271443653720","Name":"Car2"},{"Id":"439319486078105","Name":"Electronics1.2"},{"Id":"115147185289433","Name":"Product"}];

var viewModel = function() {
    var self = this;

    this.pages = ko.mapping.fromJS(initialData);

    this.refresh = function () {
         ko.mapping.fromJS(json, self.pages);
    };
};

ko.applyBindings(new viewModel());

jqueryクリックバインディングを削除しました。Knockoutバインディングの代わりにjqueryクリックバインドを使用する必要がある理由はありますか？可能であれば、この2つを混合することはお勧めしません。これにより、関心の分離が希薄になり、KOの実施が非常に得意になります。

お役に立てれば。

于 2012-05-18T22:40:14.397 に答える