Here is my code:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="kendo.common.min.css" rel="stylesheet" />
<link href="kendo.kendo.min.css" rel="stylesheet" />
<script src="js/jquery-1.6.2.min.js"></script>
<script src="js/kendo.all.min.js"></script>
<style>
.contain {
width: 800px;
height: auto;
}
</style>
</head>
<body>
<div id="container" class="contain">
<div id="grid"></div>
</div>
<script>
$(document).ready(function () {
var source = [
{
"firstname": "Richard",
"lastname": "Rostant"
},
{
"firstname": "John",
"lastname": "Smith"
},
{
"firstname": "Harry",
"lastname": "Summers"
},
{
"firstname": "Henry",
"lastname": "Ford"
}
];
var ndataSource = new kendo.data.DataSource({ data: source });
$("#grid").kendoGrid({
datasource: ndataSource,
columns: [
{
field: "firstname",
title: "First Name"
},
{
field: "lastname",
title: "Last Name"
}
],
height: 600
});
});
</script>
</body>
</html>
I can't seem to get the grid to display anything. It renders, but no data is being displayed. I am sure that it is something simple that is just eluding me.Any help would be appreciated.
2 Answers, 1 is accepted
It seems that you have misspelled the dataSource option of the grid. It is case-sensitive thus it should be dataSource not datasource.
Best wishes,Rosen
the Telerik team
Rank 2
Thanks so much. I knew wit was probably something simple. I'll give that a shot.