DHTMLx Grid Example

by harsha3223

HTML

<script src="https://ideaflyer.s3.amazonaws.com/dhtmlx4/dhtmlx.js"></script>
<link rel="stylesheet" href="https://ideaflyer.s3.amazonaws.com/dhtmlx4/dhtmlx.css">
<html>

  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  </head>
  <script>
    function create() {
      mygrid = new dhtmlXGridObject('gridbox');
      mygrid.setImagePath("./codebase/imgs/");
      mygrid.setHeader("&nbsp;, Type, 01/Mar/2017,01/Apr/2017,01/May/2017, 01/Jun/2017");
      mygrid.setInitWidths("25, 250, 100, 100, 100, 100");
      mygrid.setColAlign("left, left, center, center, center, center");
      mygrid.setColTypes("img,ro,ed,ed,ed,ed");
      mygrid.init();
      data1 = {
        rows: [{
            id: 1,
            data: ["http://www.energysaving.gov.hk/mobile/filemanager/template/common/images/btn_09_more_icon.png", "Override", "1", "1", "1", "1"]
          },
          {
            id: 'O0',
            data: [" ", "&nbsp;&nbsp;&nbsp;&nbsp;User Override", "0.5", "0.5", "0.5", "0.5"]
          },
          {
            id: 'O1',
            data: [" ", "&nbsp;&nbsp;&nbsp;&nbsp;Cleanse Override", "0.75", "0.75", "0.75", "0.75"]
          },
          {
            id: 2,
            data: [" ", "Base", "2", "2", "2", "2"]
          },
          {
            id: 3,
            data: [" ", "Total", "3", "3", "3", "3"]
          },
          {
            id: 4,
            data: [" ", "Mean", "4", "4", "4", "4"]
          },
          {
            id: 5,
            data: [" ", "Total MA", "5", "5", "5", "5"]
          },
          {
            id: 6,
            data: [" ", "Dep Demand", "6", "6", "6", "6"]
          },
          {
            id: 7,
            data: [" ", "Stored", "7", "7", "7", "7"]
          },
          {
            id: 8,
            data: [" ", "Computed", "8", "8", "8", "8"]
          },
          {
            id: 9,
            data: [" ", "PDM", "9", "9", "9", "9"]
          },
        ]
      };
      data2...