<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>        
<script  src="../../codebase/dhtmlxgridcell.js"></script>    
 
 
 
    <div id="gridbox" style="width:500px; height:270px; background-color:white;"></div>
<br>    
<a href="javascript:void(0)" onclick='mygrid.clearAll();alert("old data cleared\nloading new one..."); mygrid.parse(data,"json")'>Reload from JSON object</a><br/>
 
<script>
data = {
    rows: [{
        id: 1001,
        data: ["100", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1002,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1003,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1004,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1005,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1006,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1007,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1008,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1009,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10010,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 1011,
        data: ["101", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1012,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1013,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1014,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1015,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1016,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1017,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1018,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1019,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10110,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1021,
        data: ["102", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1022,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1023,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1024,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1025,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1026,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1027,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1028,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1029,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10210,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1031,
        data: ["103", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1032,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1033,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1034,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1035,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1036,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1037,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1038,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1039,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10310,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1041,
        data: ["104", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1042,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1043,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1044,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1045,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1046,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1047,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1048,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1049,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10410,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1051,
        data: ["105", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1052,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1053,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1054,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1055,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1056,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1057,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1058,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1059,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10510,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1061,
        data: ["106", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1062,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1063,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1064,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1065,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1066,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1067,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1068,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1069,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10610,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1071,
        data: ["107", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1072,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1073,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1074,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1075,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1076,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1077,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1078,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1079,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10710,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1081,
        data: ["108", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1082,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1083,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1084,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1085,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1086,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1087,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1088,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1089,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10810,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, 
{
        id: 1091,
        data: ["109", "A Time to Kill", "John Grisham", "12.99", "1", "05/01/1998"]
        }, {
        id: 1092,
        data: ["1000", "Blood and Smoke", "Stephen King", "0", "1", "01/01/2000"]
        }, {
        id: 1093,
        data: ["-200", "The Rainmaker", "John Grisham", "7.99", "0", "12/01/2001"]
        }, {
        id: 1094,
        data: ["350", "The Green Mile", "Stephen King", "11.10", "1", "01/01/1992"]
        }, {
        id: 1095,
        data: ["700", "Misery", "Stephen King", "7.70", "0", "01/01/2003"]
        }, {
        id: 1096,
        data: ["-1200", "The Dark Half", "Stephen King", "0", "0", "10/30/1999"]
        }, {
        id: 1097,
        data: ["1500", "The Partner", "John Grisham", "12.99", "1", "01/01/2005"]
        }, {
        id: 1098,
        data: ["500", "It", "Stephen King", "9.70", "0", "10/15/2001"]
        }, {
        id: 1099,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }, {
        id: 10910,
        data: ["400", "Cousin Bette", "Honore de Balzac", "0", "1", "12/01/1991"]
        }]
    }
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath("../../codebase/imgs/");
mygrid.setHeader("Sales, Book Title, Author");
mygrid.setInitWidths("70,250,*");
mygrid.setColAlign("right,left,left");
mygrid.setColTypes("dyn,ed,ed");
mygrid.setColSorting("int,str,str");
mygrid.init();
mygrid.setSkin("dhx_skyblue");
mygrid.load("../common/data.json", "json");</script>