Я использую сетку kendo ui в своем базовом приложении.я использовал эти коды.
https://github.com/telerik/kendo-backbone
Но у меня эта ошибка в firebug.
invalid 'instanceof' operand backboneModel
if (!(model instanceof backboneModel)) {
У меня есть этот код.
cartlistview.js
define([
'jquery',
'underscore',
'backbone',
'kendo',
'model/cart_model',
'model/invoice_model',
'model/input_model',
'collection/cart_collection',
'collection/invoice_detail_collection',
'collection/invoice_collection',
'text!templates/cart/cartlist.html'
], function($, _, Backbone, kendoGrid, Cart, Invoice, Input, CartCollection, InvoiceDetailCollection, InvoiceCollection, CartListTemplate){
var Model = kendo.data.Model,
ObservableArray = kendo.data.ObservableArray;
function wrapBackboneModel(backboneModel, fields) {
return Model.define({
fields: fields,
init: function(model) {
if (!(model instanceof backboneModel)) {
model = new backboneModel(model);
}
Model.fn.init.call(this, model.toJSON());
this.backbone = model;
},
set: function(field, value) {
Model.fn.set.call(this, field, value);
this.backbone.set(field, value);
}
});
}
function wrapBackboneCollection(model) {
return ObservableArray.extend( {
init: function(collection) {
ObservableArray.fn.init.call(this, collection.models, model);
this.collection = collection;
},
splice: function(index, howMany) {
var itemsToInsert, removedItemx, idx, length;
itemsToInsert = Array.prototype.slice.call(arguments, 2);
removedItems = kendo.data.ObservableArray.fn.splice.apply(this, arguments);
if (removedItems.length) {
for (idx = 0, length = removedItems.length; idx < length; idx++) {
this.collection.remove(removedItems[idx].backbone);
}
}
if (itemsToInsert.length) {
for (idx = 0, length = itemsToInsert.length; idx < length; idx++) {
this.collection.unshift(itemsToInsert[idx].backbone);
}
}
return removedItems;
}
});
}
kendobackboneCollection = wrapBackboneCollection;
kendobackboneModel = wrapBackboneModel;
var CartListView = Backbone.View.extend({
el: $("#cartContainer"),
events:{
"click .k-grid-save-changes" : "save"
},
initialize: function(){
CartCollection.bind("add", this.render, this);
CartCollection.bind("change:QuantityOrdered", this.render, this);
CartCollection.bind("change:ExtPriceRate", this.render, this);
},
render: function(){
$("#cartContainer").html(CartListTemplate);
var CartWrapper = kendobackboneModel(cart, {
ItemCode: { type: "string" },
ItemDescription: { type: "string" },
RetailPrice: { type: "string" },
Qty: { type: "string" },
});
var CartCollectionWrapper = kendobackboneCollection(CartWrapper);
this.$("#grid").kendoGrid({
editable: true,
toolbar: [{ name: "save", text: "Complete" }],
columns: [
{field: "ItemDescription", title: "ItemDescription"},
{field: "QuantityOrdered", title: "Qty",width:80},
{field: "SalesPriceRate", title: "UnitPrice"},
{field: "ExtPriceRate", title: "ExtPrice"}
],
dataSource: {
schema: {model: CartWrapper},
data: new CartCollectionWrapper(cartcollection),
}
});
},
save: function(){
var input = new Input();
var invoicecollection = new InvoiceCollection();
var invoicedetail = new InvoiceDetailCollection();
_.each(cartcollection.models, function(cart){
invoicedetail.add( cart );
});
input.set({ "Invoices": invoicecollection.toJSON() });
input.set({ "InvoiceDetails": invoicedetail });
if( invoicedetail.length === 0){
alert("Shopping Cart is Empty");
}else{
alert(JSON.stringify(input));
input.save(input, {success: function(model, result){
var InvoiceCode = result.InvoiceCode;
alert("Transaction Complete., Invoice code:"+InvoiceCode);
}});
cartcollection.reset();
invoicedetail.reset();
this.render();
}
}
});
return new CartListView;
});
коллекция моей корзины
define([
'underscore',
'backbone',
'model/cart_model'
],function(_, Backbone, Cart){
var CartCollection = Backbone.Collection.extend({
model: Cart,
initialize: function(){
}
});
return CartCollection;
});