Kendo UI:调用数据源同步后不会触发更新传输

时间:2013-08-10 07:02:37

标签: ajax asp.net-web-api kendo-ui kendo-mvvm

我现在在几个小时内就此挣扎,我找不到如何使用表单和Kendo MVVVM和数据源在服务器上实现简单的ajax UPDATE的良好文档。

KENDO MVVM

$(function() {

    var apiUrl = "http://a31262cd2f034ab8bcda22968021f3b8.cloudapp.net/api",            
        meetingDatasource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: apiUrl + "/meetings/4",
                    dataType: "jsonp"
                },
                update: {
                    type: "PUT",
                    url: apiUrl + "/meetings",
                    contentType: "application/json; charset=utf-8",
                    dataType: 'json',
                },

                parameterMap: function(options, operation) {
                    return kendo.stringify(options);
                }
            },
            batch: true,
            change: function() {
            },
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        Title: { editable: true },
                        StartTime: { type: "date" },
                        EndTime: { type: "date" }
                    }
                }
            }
        });

    meetingDatasource.fetch(function () {

        var viewModel = kendo.observable({
            description: result.Description,
            title: result.Title,
            venue: result.Location,
            startDate: result.StartTime,
            endDate: result.EndTime,
            saveChanges: function (e) {

                //im not sure with this line
                this.set("Title", this.Title);
                meetingDatasource.sync();

                e.preventDefault();

            }
        });

        kendo.bind($("#view"), viewModel);
    });

});

用户界面

<ul class="forms"  id="ul-meeting">
            <li>
                <label for="title" >Title:</label> 
                <input data-bind="value: title" class="k-textbox" style="width:350px;"/>
            </li>
            <li>
                <label for="description" >Description:</label> 
                <textarea data-bind="value: description"  id="description" rows="6" cols="80" class="k-textbox" style="width:350px;"></textarea>
            </li>
            <li>    
                <label for="location">Venue:</label> 
                <textarea  data-bind="value: venue" id="location" rows="4" cols="80" class="k-textbox" style="width:350px;"></textarea>
            </li>
            <li>
                <p>
                    <label for="start-datetime">Start:</label> 
                    <input  data-bind="value: startDate" id="start-datetime" style="width:200px;" />
                </p>
                <p>
                    <label for="end-datetime">Finish:</label> 
                    <input data-bind="value: endDate"  id="end-datetime" style="width:200px;" />
                </p>
            </li>
        </ul>

问题是,TRANSPORT READ触发但是即使我明确调用Datasource.sync(),TRANSPORT UPDATE也不会触发。这是我在这里缺少的东西吗?

1 个答案:

答案 0 :(得分:1)

您的代码不完整(您没有显示result或触发saveChanges的方式,但从我看到的问题是您没有更新DataSource的内容({{ 1}})。

在您的代码中复制meetingDataSourceresult的字段,但您永远不会更新ObservableObject的内容。当您执行DataSource时,this.set不是this,因此当您致电DataSource时,您什么都不做。

尝试做:

sync

这应该可以解决问题!