Next
Update
Prev
Data URL
Data

The Grid representation can be modified dynamically by calling a JavaScript function. This sample Grid demonstrates dynamic data change. Click the buttons below the sample Grid.

var gridApp, gridRoot, dataGrid;
					
function gridReadyHandler(id) {
  gridApp = document.getElementById(id);
  gridRoot = gridApp.getRoot();

  gridApp.setLayout(layoutStr);
  gridApp.setData(gridData);

  var layoutCompleteHandler = function(event) {
    dataGrid = gridRoot.getDataGrid();
  }
  
  gridRoot.addEventListener("layoutComplete", layoutCompleteHandler);
}
					
function changeDataURL() {
  gridApp.setDataURLEx("./Data/DataOneDepthMailSend.txt");  
}

function changeData() {
  gridApp.setData(gridData2);  
}

var gridData = [
  {From: "Amit1", Subject: "GMC-1 Release1", ReceiveDate: "2014/09/06", SendDate: "2014/09/06", CC: "Jim", Length: 75126, Level: 1, AttachCount: 0},
  {From: "Amit1", Subject: "GMC-1 Release3", ReceiveDate: "2014/08/06", SendDate: "2014/08/05", CC: "Jim", Length: 1654, Level: 3, AttachCount: 1},
  {From: "Barb1", Subject: "GMC-1 Release3", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Anant", Length: 651616, Level: 1, AttachCount: 3},
  {From: "Barb1", Subject: "GMC-1 Release4", ReceiveDate: "2014/08/06", SendDate: "2014/08/05", CC: "Anant", Length: 8453, Level: 1, AttachCount: 6},
  {From: "Harry1", Subject: "GMC-1 Release2", ReceiveDate: "2013/02/06", SendDate: "2013/02/06", CC: "Ram", Length: 1230351, Level: 2, AttachCount: 2},
  {From: "Harry1", Subject: "GMC-1 Release3", ReceiveDate: "2013/02/06", SendDate: "2013/02/06", CC: "Ram", Length: 89415, Level: 8, AttachCount: 0},
  {From: "John1", Subject: "GMC-1 Release2", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Jim", Length: 312547, Level: 7, AttachCount: 0},
  {From: "John1", Subject: "GMC-1 Release3", ReceiveDate: "2014/07/06", SendDate: "2014/07/06", CC: "Jim", Length: 4656, Level: 2, AttachCount: 1},
  {From: "Phill1", Subject: "GMC-1 Release3", ReceiveDate: "2014/08/06", SendDate: "2014/07/05", CC: "Jim", Length: 35748, Level: 9, AttachCount: 12},
  {From: "Phill1", Subject: "GMC-1 Release4", ReceiveDate: "2014/08/06", SendDate: "2014/07/22", CC: "Jim", Length: 70416, Level: 1, AttachCount: 31},
  {From: "Jerry1", Subject: "GMC-1 Release4", ReceiveDate: "2013/21/06", SendDate: "2013/21/06", CC: "Boa", Length: 6813, Level: 1, AttachCount: 2},
];

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

[DataOneDepthMailSend.txt]
[
    {
        "Selected": false,
        "From": "Amit",
        "Subject": "GMC-1 Release1",
        "ReceiveDate": "2013/12/07",
        "SendDate": "2013/12/06",
        "CC": "Jim",
        "Length": 75126,
        "Level": 1,
        "AttachCount": 1
    },
    {
        "Selected": false,
        "From": "Amit",
        "Subject": "GMC-1 Release2",
        "ReceiveDate": "2013/12/07",
        "SendDate": "2013/12/06",
        "CC": "Jim",
        "Length": 95822,
        "Level": 1,
        "AttachCount": 2
    },
    {
        "Selected": false,
        "From": "Amit",
        "Subject": "GMC-1 Release3",
        "ReceiveDate": "2013/12/11",
        "SendDate": "2013/12/11",
        "CC": "Jim",
        "Length": 1862456,
        "Level": 3,
        "AttachCount": 0
    },
    {
        "Selected": false,
        "From": "Barb",
        "Subject": "GMC-1 Release3",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Anant",
        "Length": 65488,
        "Level": 8,
        "AttachCount": 31
    },
    {
        "Selected": false,
        "From": "Barb",
        "Subject": "GMC-1 Release4",
        "ReceiveDate": "2013/12/06",
        "SendDate": "2013/12/06",
        "CC": "Anant",
        "Length": 4851568,
        "Level": 8,
        "AttachCount": 1
    },
    {
        "Selected": true,
        "From": "Harry",
        "Subject": "GMC-1 Release2",
        "ReceiveDate": "2013/11/28",
        "SendDate": "2013/11/28",
        "CC": "Ram",
        "Length": 13548,
        "Level": 1,
        "AttachCount": 0
    },
    {
        "Selected": false,
        "From": "Harry",
        "Subject": "GMC-1 Release3",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Ram",
        "Length": 1235,
        "Level": 1,
        "AttachCount": 12
    },
    {
        "Selected": false,
        "From": "John",
        "Subject": "GMC-1 Release2",
        "ReceiveDate": "2013/12/07",
        "SendDate": "2013/12/07",
        "CC": "Jim",
        "Length": 84621877,
        "Level": 5,
        "AttachCount": 20
    },
    {
        "Selected": false,
        "From": "John",
        "Subject": "GMC-1 Release3",
        "ReceiveDate": "2013/12/07",
        "SendDate": "2013/12/06",
        "CC": "Jim",
        "Length": 51846,
        "Level": 5,
        "AttachCount": 3
    },
    {
        "Selected": false,
        "From": "Phill",
        "Subject": "GMC-1 Release1",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Jim",
        "Length": 31680,
        "Level": 3,
        "AttachCount": 5
    },
    {
        "Selected": false,
        "From": "Phill",
        "Subject": "GMC-1 Release1",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Jim",
        "Length": 1813,
        "Level": 2,
        "AttachCount": 0
    },
    {
        "Selected": false,
        "From": "Phill",
        "Subject": "GMC-1 Release3",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Jim",
        "Length": 13548,
        "Level": 2,
        "AttachCount": 1
    },
    {
        "Selected": false,
        "From": "Phill",
        "Subject": "GMC-1 Release4",
        "ReceiveDate": "2013/12/08",
        "SendDate": "2013/12/08",
        "CC": "Jim",
        "Length": 16588,
        "Level": 1,
        "AttachCount": 0
    },
    {
        "Selected": false,
        "From": "James",
        "Subject": "GMC-1 Release4",
        "ReceiveDate": "2013/11/21",
        "SendDate": "2013/11/21",
        "CC": "Michael",
        "Length": 5158,
        "Level": 9,
        "AttachCount": 0
    },
    {
        "Selected": false,
        "From": "James",
        "Subject": "GMC-1 Release5",
        "ReceiveDate": "2013/11/19",
        "SendDate": "2013/11/19",
        "CC": "William",
        "Length": 216815,
        "Level": 8,
        "AttachCount": 2
    },
    {
        "Selected": false,
        "From": "James",
        "Subject": "GMC-1 Release6",
        "ReceiveDate": "2013/11/22",
        "SendDate": "2013/11/20",
        "CC": "David",
        "Length": 312566,
        "Level": 7,
        "AttachCount": 3
    }
]

© 2017 KoolChart. All rights reserved.