0

リストビューを使用してローカル json 変数にデータを追加しようとしています。ビューモデルの一部である剣道データソース内にデータ配列をまとめました。

問題は、トランスポートの「作成」アクションに到達するまでに、ローカル配列が更新されていないことですが、実際には viewmodel.dataSource.data が更新されていました。トランスポートの作成アクションに到達したときにローカル データ配列を更新するにはどうすればよいですか。

これが私のコードのJsfiddleです。

    var data =
        [{
            "ID": 3,
            "TopMenuId": 2,
            "Title": "Cashier",
            "Link": "www.fake123.com"
        },
        {
            "ID": 4,
            "TopMenuId": 2,
            "Title": "Deposit",
            "Link": "www.fake123.com"
        }
        ];

    var viewModel = kendo.observable({
        dataSource: new kendo.data.DataSource({
            transport: {
                read: function (options) {
                    alert("Read");
                    options.success(data);
                },
                create: function (options) {
                    debugger;

                    alert("Create");
                    alert(data.length);
                },
                update: function (options) {
                    alert("Update");
                },
                destroy: function (options) {
                    alert("Destroy");
                    alert(data.length);
                }
            },
            batch: true,
            pageSize: 4,
            schema: {
                model: {
                    id: "ID",
                    fields: {
                        ID: {
                            editable: false,
                            nullable: true
                        },
                        TopMenuId: {
                            editable: false,
                            nullable: true
                        },
                        Title: {
                            editable: true,
                            validation: {
                                required: true
                            }
                        },
                        Link: {
                            editable: true
                        }
                    }
                },
                data: "",
                total: function (result) {
                    result = result.data || result;
                    return result.length || 0;
                }
            },
        }),
    });

    //kendo.init($("#briefOverview"));
    $(document).ready(function () {

        kendo.bind($("#briefOverview"), viewModel);
        $(".k-add-button").click(function (e) {
            var listView = $("#listsContainer").data("kendoListView");
            listView.add();
            e.preventDefault();
        });
    });
4

1 に答える 1

0

transportのcreateメソッドは、実際に dataSource を更新するために呼び出されます。それがローカルかリモートかに関係なく、そうすることが期待されます。

したがって、あなたの場合の考慮事項は次のとおりです。

  1. ローカルの dataSource を更新する必要があります (要素を追加します)。
  2. を割り当てる必要があります(終了時にデフォルト以外の値(あなたの場合はnullとは異なる値)を持つidことが期待されます)。createid
  3. options.success最後に、サーバーから返された要素 (通常は割り当てられた) を使用して呼び出す必要があります (idローカルである場合) 受信したものと同じですが、ID塗りつぶされています。

したがって、あなたのcreate方法は次のようになります。

create: function (options) {
    debugger;
    var item = options.data.models[0];
    // assign an ID, here I pick a Kendo generated UID
    item.ID = kendo.guid();
    data.push(item);
    alert("Create with ID: " + item.ID);
    alert(data.length);
    options.success(item);
},

ここで変更された JSFiddle : http://jsfiddle.net/3ADTM/1/

options.successところで、 onも呼び出す必要がありますupdate

update: function (options) {
    alert("Update");
    options.success(options.data.models[0]);
},

最終的な JSFiddle : http://jsfiddle.net/3ADTM/2/

于 2013-11-09T23:19:49.597 に答える