Kendo MVVM使用远程数据源创建新记录

Question

我想我错过了一些简单的东西,但我找不到任何显示如何做到这一点的例子...另外,如果我使用的一些术语是错误的,请原谅我.

我只想使用绑定到Kendo Observable对象的HTML表单在我的远程数据源中创建一个新记录.

我见过的所有例子都显示了如何编辑现有记录,但这不是我想要的(至少目前不是这样).

我创建了一个小提琴http://jsfiddle.net/matbeard/fYfYz/2/,其中包含了迄今为止我所获得的简单截断版本.显然它不会实际保存记录,因为创建URL不指向任何地方,但我相信我可以处理它.

有人可以指点我正确的方向吗？谢谢.

因为没有它我就不能发一个问题,这里有一些从小提琴复制的代码:

var model = kendo.data.Model.define({
id: "id",
fields: {
    id: { type: 'number' },
    field1: { type: 'string' },
    field2: { type: 'string' },
    field3: { type: 'string' }
}
});

var viewModel = kendo.observable({
dataSource: new kendo.data.DataSource({
    type: 'json',
    transport: {
        create: {
            url: '/myurl/create',
            dataType: 'json',
            type: 'post'
        }
    },
    schema: {
        data: 'data',
        model: model
    }
});
});

kendo.bind($("#my-form"), viewModel);

Answer 1

让我们略有不同......

• 您的表单不需要(应该)绑定到包含的对象,DataSource因为您实际上并没有保存dataSource而只保存一条记录.

因此,您应该将模型定义为:

var Model = kendo.data.Model.define({
    id: "id",
    fields: {
        id: { type: 'number' },
        field1: { type: 'string' },
        field2: { type: 'string' },
        field3: { type: 'string' }
    }
});

在DataSource现在成为一个对象每本身:

var dataSource = new kendo.data.DataSource({
    type: 'json',
    transport: {
        create: "/myurl"
    },
    schema: {
        model: Model
    }
});

并且您的可观察对象具有data元素,该元素是Modeldefined(new Model())的实例.

var viewModel = kendo.observable({
    data: new Model(),
    mySave: function(e){
        console.log("this", this.data);
        dataSource.add(this.data);
        e.preventDefault();
    }
});

所以,你的表单现在应该是这样的:

<form id="my-form">
    <input name="field1" data-bind="value:data.field1" type="text" />
    <input name="field2" data-bind="value:data.field2" type="text" />
    <input name="field3" data-bind="value:data.field3" type="text" />
    <button data-bind="click: mySave">Save</button>
</form>

你的JSFiddle modiefied http://jsfiddle.net/6LHx3/4/