如何在本MVC SPA中將kendo ui網格綁定到其數據源？

使用下面的源代碼作爲模板：https://github.com/Simba-Mupfunya/Kendo-UI-SPA-Template-vs2013-MVC5 如何在本MVC SPA中將kendo ui網格綁定到其數據源？

我試圖綁定其他Kendo UI控件，如網格和調度程序在javascript後面的代碼中的模型。我曾嘗試...

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: "[email protected]" } 
     , { Name: "Joe Coffee", Phone: "555-1234", Email: "[email protected]" } 
     , { Name: "Ham Son", Phone: "555-1234", Email: "[email protected]" } 
     , { Name: "Dan Fooey", Phone: "555-1234", Email: "[email protected]" } 
    ], 
    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; 

});

來源

2015-10-24 Adam Cox

我不熟悉的劍道的視圖實現，但沒有你嘗試在視圖的show（）函數中移動'kendo.bind（）'？在我看來，在渲染任何東西之前你正在運行bind方法。 – Brett

這不回答你的具體問題，但是在你的 '真實' 的實施，我想你」你需要從一個真正的數據源獲取數據嗎？在這種情況下，您可能希望數據通過MVC或Web Api控制器來傳遞。爲此，您需要在數據源中手動配置AJAX調用。看到這個（你需要使用「運輸」對象的「讀」屬性，它會自動採用AJAX撥打電話）

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

來源

2015-12-09 02:03:18

如何在本MVC SPA中將kendo ui網格綁定到其數據源？

回答

相關問題