JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdn.kendostatic.com/2014.2.1008/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.dataviz.default.min.css">
<div id="grid"></div>
JavaScript
var data = [
{"PathLabelID":2067, "PathLabel":"Ang", "Angel":true, "Development":false},
{"PathLabelID":2066, "PathLabel":"Dev", "Angel":false, "Development":true },
{"PathLabelID":2064, "PathLabel":"Sam", "Angel":false, "Development":true },
{"PathLabelID":2065, "PathLabel":"Users", "Angel":true, "Development":true}
];
var pathCategoryResult = [
{"PathCategory":"Angel"},
{"PathCategory":"Development"}
];
function createColumn() {
var pathCategories = pathCategoryResult,
columns = [];
columns.push(
{
field: "PathLabelID",
title: "PathLabelID",
hidden: true
},
{
field: "PathLabel",
title: "Name"
});
$.each(pathCategories, function(key, value) {
$.each(value, function(k, v) {
columns.push(
{
field: v,
title: v
}
);
});
});
return columns;
}
function createGrid() {
var col = createColumn();
$("#grid").kendoGrid({
dataSource: { data: data },
columns: col
});
}
createGrid();
//createColumn();