This is a migrated thread and some comments may be shown as answers.

Trying to Populate Grid Data

1 Answer 799 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Kerry asked on 08 Jun 2016, 10:21 PM

OK, I am a total stinking newb. This is an idiotic question, that I'm sure will serve as a laughingstock for years to come.

So I have a grid ... I have columns defined for that grid, and the names of the data elements that I expect to appear in those columns. As well as button at the end of each row that will, at some point, you know ... do stuff. So I have this below ... and it doesn't do that. I get the names and ages ...

but then I also get "bar" in the last column ... Why? I never told anyone about the "foo" element.
also I don't get the button at the end of the row that I expect.

So far I've narrowed the problem down to somewhere between the <html> and </html> tags.

Thanks in advance, for any and all sense that you kind folks may knock into me :-)

Here's the code:

<!DOCTYPE html>

<html>

<head>

<title></title>

<link rel="stylesheet" href="/content/kendo/kendo.common.min.css" />

<link rel="stylesheet" href="/content/kendo/kendo.default.min.css" />

<script src="/scripts/kendo/jquery.min.js"></script>

<script src="/scripts/kendo/kendo.web.min.js"></script>

</head>

<body>

<input id="testButton" type="button" value="Click Me" onclick="testButton_onclick(this)" />

<div id="example">

<div id="grid"></div>

<script>

$().ready(function () {

setupKendoGridInitial();

});

function setupKendoGridInitial() {

$("#grid").kendoGrid({

columns: [

{ field: "name", title: "Happy Name" }

, { field: "age" }

, {

command: [

{

name: "details",

click: function (e) {

rowEdit(e);

}

]

}

]

});

}

function rowEdit(e) {

alert("Do stuff: " + e.age);

}

function testButton_onclick(event) {

// let's pretend I just called Web API and got this as JSON from the server

var structuredData =

{

blinkyBot: 1,

grannyGunner: "xyz",

funkyRows: [

{ name: "Jimmie Doe", age: 70, foo: "bar" },

{ name: "Johnny Doe", age: 73, foo: "bar" }

]

};

$("#grid").kendoGrid({

dataSource: structuredData.funkyRows

});

}

</script>

</div>

</body>

</html>

1 Answer, 1 is accepted

Accepted