Question

使用以下来源作为模板：https://github.com/Simba-Mupfunya/Kendo-UI-SPA-Template-vs2013-MVC5

我正在尝试将其他Kendo UI控件（如网格和调度程序）绑定到javascript＆＃34;后面的代码＆＃34;中的模型。我试过的......

HTML：

<div data-role="grid"
    date-scrollable="true"
    data-editable="true"
    data-toolbar="['create', 'save']"
    data-columns="[
        { 'field': 'Name', 'width': 50 }
        , { 'field': 'Phone' }
        , { 'field': 'Email' }
    ]"
    data-bind="source: contacts,
    visible: isVisible,
    events: {
        save: onSave
        }"
    style="height: 200px">
</div>

JS：

define([
'text!views/contacts/contacts.html'
], function (html) {

var contactDataSource = new kendo.data.DataSource({
    data: [
        { Name: "Jim Dandy", Phone: "555-1234", Email: "jim.dandy@gmail.com" }
        , { Name: "Joe Coffee", Phone: "555-1234", Email: "joe.coffee@gmail.com" }
        , { Name: "Ham Son", Phone: "555-1234", Email: "ham.son@gmail.com" }
        , { Name: "Dan Fooey", Phone: "555-1234", Email: "dan.foo@gmail.com" }
    ],
    schema: {
        model: {
            fields: {
                Name: { type: "string" }
                , Phone: { type: "string" }
                , Email: { type: "string" }
            }
        }
    }
});

//contactDataSource.read();

var viewModel = kendo.observable({
    title: 'Contacts'
    , contacts: contactDataSource
});

kendo.bind(html, viewModel);

var view = new kendo.View(html, {
    model: viewModel,
    show: function (e) {
        kendo.fx(this.element).fade('in').duration(500).play();
    }
});

return view;

});

Answer 1

这并不能解答您的具体问题，但是在您的“真实”问题中。实现，我认为您需要从真实数据源获取数据？在这种情况下，您可能希望数据来自MVC或Web Api控制器。为此，您需要在数据源中手动配置AJAX调用。看到这一点（您需要使用＆＃39; read＆＃39;属性，该对象会自动使用AJAX进行通话）

http://docs.telerik.com/kendo-ui/framework/datasource/basic-usage#creating-a-datasource-for-remote-data

如何将kendo ui网格绑定到此MVC SPA中的数据源？

1 个答案: