kendo grid - local data
Sample from web/grid/localdata http://demos.kendoui.com/web/grid/local-data.htmll
by jwstott
HTML
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2012.1.322/js/kendo.all.min.js"></script>
<div id="example" class="k-content">
<div id="grid"></div>
</div>
JavaScript
var firstNames = ["Nancy", "Andrew", "Janet", "Margaret"],
lastNames = ["Davolio", "Fuller", "Leverling", "Peacock"],
cities = ["Seattle", "Tacoma", "Kirkland", "Redmond"],
titles = ["Accountant", "Vice President, Sales", "Sales Representative"],
birthDates = [new Date("1948/12/08"), new Date("1952/02/19"), new Date("1963/08/30")];
$("#grid").kendoGrid({
dataSource: {
data: createRandomData(50),
schema: {
model: {
fields: {
FirstName: {
type: "string"
},
LastName: {
type: "string"
},
City: {
type: "string"
},
Title: {
type: "string"
},
BirthDate: {
type: "date"
},
Age: {
type: "number"
}
}
}
},
pageSize: 10
},
height: 250,
scrollable: true,
sortable: true,
filterable: true,
pageable: {
input: true,
numeric: false
},
columns: [
{
field: "FirstName",
title: "First Name",
width: 100},
{
field: "LastName",
title: "Last Name",
width: 100},
{
field: "City",
width: 100},
{
field: "Title",
template: '<span data-bind="text: Title" />'},
{
field: "BirthDate",
title: "Birth Date",
template: '#= kendo.toString(BirthDate,"MM/dd/yyyy") #'},
{
field: "Age",
width: 50}
]
});
function createRandomData(count) {
var data = [],
now = new Date();
for (var i = 0; i < count; i++) {
var firstName = firstNames[Math.floor(Math.random() * firstNames.length)],
lastName =...