0

我现在几个小时都在努力解决这个问题,我找不到关于如何使用表单和 Kendo MVVVM 和数据源在服务器上实现简单 ajax UPDATE 的好文档。

剑道 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 触发但 TRANSPORT UPDATE 永远不会触发,即使我明确调用 Datasource.sync()。是我在这里想念的东西吗?

4

1 回答 1

2

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

在您将字段复制result到其中的代码中,ObservableObject但您从不更新DataSource. 当您这样做时this.set,在那种情况下this并非DataSource如此,当您打电话时,sync您什么也不做。

尝试做:

meetingDatasource.data()[0].set(`Title`, this.Title);
meetingDatasource.sync();

这应该可以解决问题!

于 2013-08-12T10:36:31.443 回答