Next
Update
Prev

KoolGrid uses XML, JSON, CSV, TSV formatted Dataset to represent a Grid, and gets the Dataset information from a variable or an URL of the file. This sample Grid demonstrates how to represent a Grid by calling the setData() method to get the Dataset information (JSON) from a JSON object (JavaScript Array).

function gridReadyHandler(id) {
  document.getElementById(id).setLayout(layoutStr);
  document.getElementById(id).setData(gridData);
  
}

var gridData = [
  {From: "Amit", Subject: "GMC-1 Release1", ReceiveDate: "2014/09/06", SendDate: "2014/09/06", CC: "Jim", Length: 451572, Level: 1, AttachCount: 0},
  {From: "Amit", Subject: "GMC-1 Release3", ReceiveDate: "2014/08/06", SendDate: "2014/08/05", CC: "Jim", Length: 693572, Level: 3, AttachCount: 1},
  {From: "Amit", Subject: "GMC-1 Release3", ReceiveDate: "2014/08/06", SendDate: "2014/08/06", CC: "Jim", Length: 8281, Level: 1, AttachCount: 12},
  {From: "Barb", Subject: "GMC-1 Release3", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Anant", Length: 82371, Level: 2, AttachCount: 3},
  {From: "Barb", Subject: "GMC-1 Release4", ReceiveDate: "2014/08/06", SendDate: "2014/08/05", CC: "Anant", Length: 9286, Level: 5, AttachCount: 6},
  {From: "Harry", Subject: "GMC-1 Release2", ReceiveDate: "2013/02/06", SendDate: "2013/02/06", CC: "Ram", Length: 2468, Level: 6, AttachCount: 2},
  {From: "Harry", Subject: "GMC-1 Release3", ReceiveDate: "2013/02/06", SendDate: "2013/02/06", CC: "Ram", Length: 863145, Level: 1, AttachCount: 0},
  {From: "John", Subject: "GMC-1 Release2", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Jim", Length: 6514, Level: 4, AttachCount: 0},
  {From: "John", Subject: "GMC-1 Release3", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Jim", Length: 325418, Level: 2, AttachCount: 1},
  {From: "Phill", Subject: "GMC-1 Release1", ReceiveDate: "2014/08/06", SendDate: "2014/07/05", CC: "Jim", Length: 2464, Level: 8, AttachCount: 12},
  {From: "Phill", Subject: "GMC-1 Release1", ReceiveDate: "2014/08/06", SendDate: "2014/07/22", CC: "Jim", Length: 9841, Level: 9, AttachCount: 31},
  {From: "Phill", Subject: "GMC-1 Release3", ReceiveDate: "2014/08/06", SendDate: "2014/07/27", CC: "Jim", Length: 1575, Level: 1, AttachCount: 0},
  {From: "Phill", Subject: "GMC-1 Release4", ReceiveDate: "2014/08/06", SendDate: "2014/07/06", CC: "Jim", Length: 91559, Level: 3, AttachCount: 1},
  {From: "Jerry", Subject: "GMC-1 Release4", ReceiveDate: "2013/21/06", SendDate: "2013/21/06", CC: "Boa", Length: 4510, Level: 3, AttachCount: 2},
  {From: "Jerry", Subject: "GMC-1 Release5", ReceiveDate: "2013/19/06", SendDate: "2013/19/06", CC: "Boa", Length: 10569, Level: 2, AttachCount: 1},
  {From: "Jerry", Subject: "GMC-1 Release6", ReceiveDate: "2013/22/06", SendDate: "2013/22/06", CC: "Boa", Length: 56956, Level: 1, AttachCount: 0}
];

© 2017 KoolChart. All rights reserved.