backbone.js - using kendo ui grid on backbone,require,underscore and kendo

Question

How can i load or instantiate a kendo ui grid using Kendo UI grid , backbone.js , underscore.js and require.js Is it possible?

define([
'jquery',
'underscore',
'backbone',
'text!templates/cart/cartlist.html'
], function($, _, Backbone, CartListTemplate){

var mainHomeView = Backbone.View.extend({
el: $("#cartContainer"),
render: function(){
  $("#grid").kendoGrid({
    columns: ["ItemDescription", "Qty", "Price", { command: "destroy" }],
  });
  this.el.html(CartListTemplate);
}
});
 return new mainHomeView;
});

And this

CartListView.render();

But it doesn't work. It doesn't show up. Any ideas?

Answer 1

作为一般参考，我写了一篇关于在 Backbone 中使用 jQuery 插件的博客文章，并多次提到 KendoUI 作为我首选的控制套件：

http://lostechies.com/derickbailey/2012/02/20/using-jquery-plugins-and-ui-controls-with-backbone/

要具体回答您的问题，您的渲染方法有错误。

当您调用 时$("#grid").kendoGrid(...);，您是在告诉 jQuery#grid在页面的 DOM 中查找该元素，但这还不存在，因为它来自您的CartListTemplate. 设置视图后，您需要使用在视图的 HTMLthis.$中查找。#gridel.html

render: function(){
  this.$el.html(CartListTemplate);
  this.$("#grid").kendoGrid(...);
}