0

このコードで、KnockoutJs と KnockoutJs Mapping Plugin を使用して、オブジェクトのリストをチェック ボックス リストにバインドしました。

サーバーサイドクラス 

public struct FilterListItem
{
    public string Text { get; set; }
    public string Value { get; set; }
}

Javascript

$(document).ready(function () {

    var dto = { 'categoryId': getUrlVars()["scid"] };

    $.ajax({
        url: "ProductListTest.aspx/GetFiltersWeb",
        data: JSON.stringify(dto),
        type: "POST",
        contentType: "application/json",
        dataType: "JSON",
        timeout: 10000,
        success: function (result) {
            bindFilterModel(result);
        }
    });
});

function bindFilterModel(data) {
    console.log(data);
    var jsonObject;
    jsonObject = ko.mapping.fromJS(data);
    var viewModel = { CategoryList: jsonObject.d };
    ko.applyBindings(viewModel);
}

HTML

<div data-bind="foreach: CategoryList.SubCategoryList">
    <div class="line">
        <div>
            <input type="checkbox" data-bind="value: Value" /><span data-bind="text: Text"></span>
        </div>
    </div>
</div>

ユーザーがチェックボックスを選択したときに、ユーザーが選択したデータを WebMethod (Ajax 呼び出しを使用) に投稿する必要がありますが、イベントをバインドして ajax 呼び出しをトリガーする方法がわかりません。

4

1 に答える 1

0

RP のダーティ プラグインを使用できます

http://jsfiddle.net/df6z6/

ViewModel = function(data) {    
    ko.mapping.fromJS(data, {}, this);
    this.dirty = ko.dirtyFlag(this.items, false);
    this.dirty.isDirty.subscribe(this.onDirty, this);
};

ViewModel.prototype = {
    onDirty: function() {
        console.log("Post here");
        this.dirty.reset();
    }
};
于 2013-08-13T07:17:18.813 に答える