I'm modifying a bit of code that originally used the MVC extensions to generate a grid to just use the native code instead. I used the demo code for local data as a sample.
I'm not receiving any errors, but it's not actually working either. I'm sure I'm missing something silly but I'm not really seeing it. Maybe someone else will see what I'm not.
Here's what the page basically looks like:
The grid doesn't render at all - just an empty page. I'm not seeing any kinds of Javascript errors.
Not shown, but included are a reference to jQuery, kendo.web.min,js, etc. I know those references are correct because I've got another page using the same template that works (the only difference is the grid on that page gets its data via JSON).
I'm not receiving any errors, but it's not actually working either. I'm sure I'm missing something silly but I'm not really seeing it. Maybe someone else will see what I'm not.
Here's what the page basically looks like:
<div id=
"#Grid"
></div>
<script type=
"text/javascript"
>
$(document).ready(
function
() {
var
page = {
itemUrl:
'/Batch/Edit/'
,
data: eval(
'[{"CashReceipt_ID":3,"Unit_FK":1,"PaymentType_FK":1,"Amount":125.00,"AddedOn":"\/Date(1342649795203)\/","AddedBy_User_FK":null,"LastUpdatedOn":null,"LastUpdatedBy_User_FK":null,"Comment":null,"Batch_FK":1,"ItemNum":1,"PaymentNum":"1105","ReceivedFrom":"Paul Sample","Resident_FK":1,"ReceivedOn":"\/Date(1342584000000)\/","UnitNum":"113","PaymentType":"Personal Check","PaymentTypeCode":"PC ","Property_FK":1,"BatchNum":"20120331-A","FirstName":"Paul","MiddleInitial":"A","LastName":"Sample","Salutation":"Mr.","EntityState":2,"EntityKey":{"EntitySetName":"vCashReceipts","EntityContainerName":"FocusEntities","EntityKeyValues":[{"Key":"CashReceipt_ID","Value":3}],"IsTemporary":false}}]'
),
count: 1
};
var
pageHandler = (
function
() {
var
self =
this
;
this
.navigatePage =
function
(e) {
var
grid =
this
;
grid.select().each(
function
() {
var
item = grid.dataItem($(
this
));
window.location.href = page.itemUrl + item.CashReceipt_ID;
});
};
$(
"#Grid"
).kendoGrid({
change: self.navigatePage,
columns: [
{
title:
"Unit Num"
,
field:
"UnitNum"
,
encoded:
true
},
{
title:
"Payment Type"
,
field:
"PaymentType"
,
encoded:
true
},
{
title:
"Payment Num"
,
field:
"PaymentNum"
,
encoded:
true
},
{
title:
"Received From"
,
field:
"ReceivedFrom"
,
encoded:
true
},
{
title:
"Received On"
,
field:
"ReceivedOn"
,
format:
"{0:MM/dd/yyyy}"
,
encoded:
true
},
{
title:
"Amount"
,
attributes: { class:
"grid-number"
},
footerAttributes: { class:
"grid-number-footer"
},
footerTemplate:
"#=kendo.toString(sum, \u0027C\u0027) #"
,
field:
"Amount"
,
format:
"{0:c}"
,
encoded:
true
,
aggregate: [
"sum"
]
},
{
title:
"Item Num"
,
attributes: { class:
"grid-number"
},
footerAttributes: { class:
"grid-number-footer"
},
footerTemplate:
"#=count#"
,
field:
"ItemNum"
,
encoded:
true
,
aggregate: [
"count"
]
}
],
sortable:
true
,
selectable:
"Single, Row"
,
scrollable:
false
,
dataSource: {
data: page.data,
aggregate: [
{ field:
"Amount"
, aggregate:
"sum"
},
{ field:
"ItemNum"
, aggregate:
"count"
}],
schema: {
model: {
fields: {
CashReceipt_ID: { type:
"number"
},
Unit_FK: { type:
"number"
, defaultValue:
null
},
PaymentType_FK: { type:
"number"
},
Amount: { type:
"number"
, defaultValue:
null
},
AddedOn: { type:
"date"
, defaultValue:
null
},
AddedBy_User_FK: { type:
"number"
, defaultValue:
null
},
LastUpdatedOn: { type:
"date"
, defaultValue:
null
},
LastUpdatedBy_User_FK: { type:
"number"
, defaultValue:
null
},
Comment: { type:
"string"
},
Batch_FK: { type:
"number"
, defaultValue:
null
},
ItemNum: { type:
"number"
, defaultValue:
null
},
PaymentNum: { type:
"string"
},
ReceivedFrom: { type:
"string"
},
Resident_FK: { type:
"number"
, defaultValue:
null
},
ReceivedOn: { type:
"date"
},
UnitNum: { type:
"string"
},
PaymentType: { type:
"string"
},
PaymentTypeCode: { type:
"string"
},
Property_FK: { type:
"number"
, defaultValue:
null
},
BatchNum: { type:
"string"
},
FirstName: { type:
"string"
},
MiddleInitial: { type:
"string"
},
LastName: { type:
"string"
},
Salutation: { type:
"string"
}
}
}
}
}
});
return
{
navigatePage: navigatePage
};
})();
});
</script>
The grid doesn't render at all - just an empty page. I'm not seeing any kinds of Javascript errors.
Not shown, but included are a reference to jQuery, kendo.web.min,js, etc. I know those references are correct because I've got another page using the same template that works (the only difference is the grid on that page gets its data via JSON).