• Edit
  • Download
  • <!DOCTYPE html>
    <html>
    
    <head>
      <meta charset="utf-8">
      <title>ZingGrid Demo</title>
      <script nonce="undefined" src="https://cdn.zinggrid.com/zinggrid.min.js"></script>
      <style>
        .zg-body {
          background: #e6e6e6;
        }
    
        zing-grid {
          overflow: hidden;
        }
    
        zing-grid[loading] {
          height: 1133px;
        }
      </style>
    </head>
    
    <body class="zg-body">
    
      <!--
          Original Markup: 
    
          <zing-grid 
            caption="Amazon Stock Data"
            search
            height="1000"
            src="https://cdn.zinggrid.com/datasets/amzn-stock-data.json">
          </zing-grid> 
    	-->
    
    
      <!-- 
    		SSR renderered markup... 
    
    		ADDED server-rendered="true" attribute for this markup, the
    		rest of the markup is just output from the browser when ZG
    		is rendered.
    	-->
    
      <zing-grid caption="Amazon Stock Data" server-rendered="true" search="" height="1000" src="https://cdn.zinggrid.com/datasets/amzn-stock-data.json" tabindex="0" viewport="desktop">
        <zg-header slot="header"><zg-caption slot="caption">
            <div id="zg-caption-user-text">Amazon Stock Data</div><zg-button data-focusable="" slot="tool" action="removerecord" hidden="" role="button" dir="ltr" tooltip="Remove Record" tooltip-left="" aria-label="Remove Record" tabindex="-1"><zg-icon name="removerecord" slot="icon" internal-caption=""><svg id="svg--548557" slot="icon" viewBox="0 0 24 24">
                  <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--911060" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-search slot="tool"><zg-button slot="button" action="search" data-focusable="" role="button" dir="ltr" tooltip="Open Search" tooltip-left="" aria-label="Open Search" tabindex="-1"><zg-icon name="search" slot="icon" internal-caption=""><svg id="svg--972529" slot="icon" viewBox="0 0 24 24">
                    <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"></path>
                    <path d="M0 0h24v24H0z" fill="none"></path>
                  </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--694516" slot="icon" viewBox="0 0 24 24">
                      <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                    </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><input slot="input" type="search" placeholder="Search" aria-label="Search" tabindex="-1"></zg-search><zg-button data-focusable="" slot="tool" action="fixedmenu" hidden="" role="button" dir="ltr" tooltip="Open Menu" tooltip-left="" aria-label="Open Menu" aria-haspopup="true" tabindex="-1"><zg-icon name="fixedmenu" slot="icon" internal-caption=""><svg id="svg--974554" slot="icon" viewBox="0 0 24 24">
                  <path d="M0 0h24v24H0z" fill="none"></path>
                  <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--933326" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="tool" action="menu" hidden="" role="button" dir="ltr" tooltip="Open Column Menu" tooltip-left="" aria-label="Open Column Menu" aria-haspopup="true" tabindex="-1"><zg-icon name="menu" slot="icon" internal-caption=""><svg id="svg--134207" slot="icon" viewBox="0 0 24 24">
                  <path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--2412" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button>
          </zg-caption><zg-control-bar slot="control-bar" hidden=""><zg-button data-focusable="" slot="action" action="createrecord" hidden="" role="button" dir="ltr" tooltip="Insert Record" tooltip-right="" aria-label="Insert Record" tabindex="-1"><zg-icon name="createrecord" slot="icon"><svg id="svg--961677" slot="icon" viewBox="0 0 24 24">
                  <path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--125296" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batchedit" hidden="" role="button" dir="ltr" tooltip="Open Batch Edit" tooltip-right="" aria-label="Open Batch Edit" tabindex="-1"><zg-icon name="batchedit" slot="icon"><svg id="svg--934318" slot="icon" viewBox="0 0 24 24">
                  <path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--642708" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batcheditsave" hidden="" role="button" dir="ltr" tooltip="Save Batch Edit" tooltip-right="" aria-label="Save Batch Edit" tabindex="-1"><zg-icon name="batcheditsave" slot="icon"><svg id="svg--569929" slot="icon" viewBox="0 0 24 24">
                  <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--5508" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batcheditcancel" hidden="" role="button" dir="ltr" tooltip="Cancel Batch Edit" tooltip-right="" aria-label="Cancel Batch Edit" tabindex="-1"><zg-icon name="batcheditcancel" slot="icon"><svg id="svg--511257" slot="icon" viewBox="0 0 24 24">
                  <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--383294" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><span id="unsaved" slot="message" hidden=""></span></zg-control-bar></zg-header><zg-head id="lefthead" slot="lefthead" role="rowgroup"></zg-head><zg-body id="leftbody" slot="leftbody" role="rowgroup"></zg-body><zg-foot id="leftfoot" slot="leftfoot"></zg-foot><zg-colgroup id="leftcolgroup" slot="leftcolgroup"></zg-colgroup><zg-colgroup id="gridcolgroup" slot="gridcolgroup"><zg-column type="text" index="Date" min-calculated-header-width="68" min-calculated-width="107.203125" style="width: 699px;"></zg-column><zg-column type="number" index="Close" min-calculated-header-width="72" min-calculated-width="81.609375" style="width: 674px;"></zg-column></zg-colgroup><zg-colgroup id="rightcolgroup" slot="rightcolgroup"></zg-colgroup><zg-head id="mainhead" slot="gridhead" role="rowgroup"><zg-row aria-rowindex="1" role="row"><zg-head-cell cellindex="0" role="columnheader" aria-colindex="1" data-focusable="" data-field-index="Date" first="" title="" depth="1" type="text" style="left: 0px; width: 699px; line-height: 40px; height: 40px; position: absolute;" class=""><zg-icon class="zg-head-icon"></zg-icon><zg-icon class="zg-head-details-icon"></zg-icon>
              <div data-field-index="Date"><span>Date</span></div>
            </zg-head-cell><zg-head-cell cellindex="1" role="columnheader" aria-colindex="2" data-focusable="" data-field-index="Close" title="" depth="1" type="number" style="left: 699px; width: 674px; line-height: 40px; height: 40px; position: absolute;" class=""><zg-icon class="zg-head-icon"></zg-icon><zg-icon class="zg-head-details-icon"></zg-icon>
              <div data-field-index="Close"><span>Close</span></div>
            </zg-head-cell></zg-row></zg-head><zg-body id="mainbody" slot="gridbody" role="rowgroup" viewport="desktop"><zg-row aria-rowindex="2" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Mar-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Mar-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="848.91" type="number" data-field-index="Close">
              <div data-field-index="Close">848.91</div>
            </zg-cell></zg-row><zg-row aria-rowindex="3" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Mar-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Mar-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="853.08" type="number" data-field-index="Close">
              <div data-field-index="Close">853.08</div>
            </zg-cell></zg-row><zg-row aria-rowindex="4" role="row"><zg-cell aria-colindex="1" role="gridcell" value="28-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">28-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.04" type="number" data-field-index="Close">
              <div data-field-index="Close">845.04</div>
            </zg-cell></zg-row><zg-row aria-rowindex="5" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="848.64" type="number" data-field-index="Close">
              <div data-field-index="Close">848.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="6" role="row"><zg-cell aria-colindex="1" role="gridcell" value="24-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">24-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.24" type="number" data-field-index="Close">
              <div data-field-index="Close">845.24</div>
            </zg-cell></zg-row><zg-row aria-rowindex="7" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="852.19" type="number" data-field-index="Close">
              <div data-field-index="Close">852.19</div>
            </zg-cell></zg-row><zg-row aria-rowindex="8" role="row"><zg-cell aria-colindex="1" role="gridcell" value="22-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">22-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="855.61" type="number" data-field-index="Close">
              <div data-field-index="Close">855.61</div>
            </zg-cell></zg-row><zg-row aria-rowindex="9" role="row"><zg-cell aria-colindex="1" role="gridcell" value="21-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">21-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="856.44" type="number" data-field-index="Close">
              <div data-field-index="Close">856.44</div>
            </zg-cell></zg-row><zg-row aria-rowindex="10" role="row"><zg-cell aria-colindex="1" role="gridcell" value="17-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">17-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.07" type="number" data-field-index="Close">
              <div data-field-index="Close">845.07</div>
            </zg-cell></zg-row><zg-row aria-rowindex="11" role="row"><zg-cell aria-colindex="1" role="gridcell" value="16-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">16-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="844.14" type="number" data-field-index="Close">
              <div data-field-index="Close">844.14</div>
            </zg-cell></zg-row><zg-row aria-rowindex="12" role="row"><zg-cell aria-colindex="1" role="gridcell" value="15-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">15-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="842.7" type="number" data-field-index="Close">
              <div data-field-index="Close">842.7</div>
            </zg-cell></zg-row><zg-row aria-rowindex="13" role="row"><zg-cell aria-colindex="1" role="gridcell" value="14-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">14-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.39" type="number" data-field-index="Close">
              <div data-field-index="Close">836.39</div>
            </zg-cell></zg-row><zg-row aria-rowindex="14" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.53" type="number" data-field-index="Close">
              <div data-field-index="Close">836.53</div>
            </zg-cell></zg-row><zg-row aria-rowindex="15" role="row"><zg-cell aria-colindex="1" role="gridcell" value="10-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">10-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="827.46" type="number" data-field-index="Close">
              <div data-field-index="Close">827.46</div>
            </zg-cell></zg-row><zg-row aria-rowindex="16" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="821.36" type="number" data-field-index="Close">
              <div data-field-index="Close">821.36</div>
            </zg-cell></zg-row><zg-row aria-rowindex="17" role="row"><zg-cell aria-colindex="1" role="gridcell" value="8-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">8-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="819.71" type="number" data-field-index="Close">
              <div data-field-index="Close">819.71</div>
            </zg-cell></zg-row><zg-row aria-rowindex="18" role="row"><zg-cell aria-colindex="1" role="gridcell" value="7-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">7-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="812.5" type="number" data-field-index="Close">
              <div data-field-index="Close">812.5</div>
            </zg-cell></zg-row><zg-row aria-rowindex="19" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="807.64" type="number" data-field-index="Close">
              <div data-field-index="Close">807.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="20" role="row"><zg-cell aria-colindex="1" role="gridcell" value="3-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">3-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="810.2" type="number" data-field-index="Close">
              <div data-field-index="Close">810.2</div>
            </zg-cell></zg-row><zg-row aria-rowindex="21" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="839.95" type="number" data-field-index="Close">
              <div data-field-index="Close">839.95</div>
            </zg-cell></zg-row><zg-row aria-rowindex="22" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="832.35" type="number" data-field-index="Close">
              <div data-field-index="Close">832.35</div>
            </zg-cell></zg-row><zg-row aria-rowindex="23" role="row"><zg-cell aria-colindex="1" role="gridcell" value="31-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">31-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="823.48" type="number" data-field-index="Close">
              <div data-field-index="Close">823.48</div>
            </zg-cell></zg-row><zg-row aria-rowindex="24" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="830.38" type="number" data-field-index="Close">
              <div data-field-index="Close">830.38</div>
            </zg-cell></zg-row><zg-row aria-rowindex="25" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="835.77" type="number" data-field-index="Close">
              <div data-field-index="Close">835.77</div>
            </zg-cell></zg-row><zg-row aria-rowindex="26" role="row"><zg-cell aria-colindex="1" role="gridcell" value="26-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">26-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="839.15" type="number" data-field-index="Close">
              <div data-field-index="Close">839.15</div>
            </zg-cell></zg-row><zg-row aria-rowindex="27" role="row"><zg-cell aria-colindex="1" role="gridcell" value="25-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">25-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.52" type="number" data-field-index="Close">
              <div data-field-index="Close">836.52</div>
            </zg-cell></zg-row><zg-row aria-rowindex="28" role="row"><zg-cell aria-colindex="1" role="gridcell" value="24-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">24-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="822.44" type="number" data-field-index="Close">
              <div data-field-index="Close">822.44</div>
            </zg-cell></zg-row><zg-row aria-rowindex="29" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="817.88" type="number" data-field-index="Close">
              <div data-field-index="Close">817.88</div>
            </zg-cell></zg-row><zg-row aria-rowindex="30" role="row"><zg-cell aria-colindex="1" role="gridcell" value="20-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">20-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="808.33" type="number" data-field-index="Close">
              <div data-field-index="Close">808.33</div>
            </zg-cell></zg-row><zg-row aria-rowindex="31" role="row"><zg-cell aria-colindex="1" role="gridcell" value="19-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">19-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="809.04" type="number" data-field-index="Close">
              <div data-field-index="Close">809.04</div>
            </zg-cell></zg-row><zg-row aria-rowindex="32" role="row"><zg-cell aria-colindex="1" role="gridcell" value="18-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">18-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="807.48" type="number" data-field-index="Close">
              <div data-field-index="Close">807.48</div>
            </zg-cell></zg-row><zg-row aria-rowindex="33" role="row"><zg-cell aria-colindex="1" role="gridcell" value="17-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">17-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="809.72" type="number" data-field-index="Close">
              <div data-field-index="Close">809.72</div>
            </zg-cell></zg-row><zg-row aria-rowindex="34" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="817.14" type="number" data-field-index="Close">
              <div data-field-index="Close">817.14</div>
            </zg-cell></zg-row><zg-row aria-rowindex="35" role="row"><zg-cell aria-colindex="1" role="gridcell" value="12-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">12-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="813.64" type="number" data-field-index="Close">
              <div data-field-index="Close">813.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="36" role="row"><zg-cell aria-colindex="1" role="gridcell" value="11-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">11-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="799.02" type="number" data-field-index="Close">
              <div data-field-index="Close">799.02</div>
            </zg-cell></zg-row><zg-row aria-rowindex="37" role="row"><zg-cell aria-colindex="1" role="gridcell" value="10-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">10-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="795.9" type="number" data-field-index="Close">
              <div data-field-index="Close">795.9</div>
            </zg-cell></zg-row><zg-row aria-rowindex="38" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="796.92" type="number" data-field-index="Close">
              <div data-field-index="Close">796.92</div>
            </zg-cell></zg-row><zg-row aria-rowindex="39" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="795.99" type="number" data-field-index="Close">
              <div data-field-index="Close">795.99</div>
            </zg-cell></zg-row><zg-row aria-rowindex="40" role="row"><zg-cell aria-colindex="1" role="gridcell" value="5-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">5-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="780.45" type="number" data-field-index="Close">
              <div data-field-index="Close">780.45</div>
            </zg-cell></zg-row><zg-row aria-rowindex="41" role="row"><zg-cell aria-colindex="1" role="gridcell" value="4-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">4-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="757.18" type="number" data-field-index="Close">
              <div data-field-index="Close">757.18</div>
            </zg-cell></zg-row><zg-row aria-rowindex="42" role="row"><zg-cell aria-colindex="1" role="gridcell" value="3-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">3-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="753.67" type="number" data-field-index="Close">
              <div data-field-index="Close">753.67</div>
            </zg-cell></zg-row><zg-row aria-rowindex="43" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="749.87" type="number" data-field-index="Close">
              <div data-field-index="Close">749.87</div>
            </zg-cell></zg-row><zg-row aria-rowindex="44" role="row"><zg-cell aria-colindex="1" role="gridcell" value="29-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">29-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="765.15" type="number" data-field-index="Close">
              <div data-field-index="Close">765.15</div>
            </zg-cell></zg-row><zg-row aria-rowindex="45" role="row"><zg-cell aria-colindex="1" role="gridcell" value="28-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">28-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="772.13" type="number" data-field-index="Close">
              <div data-field-index="Close">772.13</div>
            </zg-cell></zg-row><zg-row aria-rowindex="46" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="771.4" type="number" data-field-index="Close">
              <div data-field-index="Close">771.4</div>
            </zg-cell></zg-row><zg-row aria-rowindex="47" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="760.59" type="number" data-field-index="Close">
              <div data-field-index="Close">760.59</div>
            </zg-cell></zg-row><zg-row aria-rowindex="48" role="row"><zg-cell aria-colindex="1" role="gridcell" value="22-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">22-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="766.34" type="number" data-field-index="Close">
              <div data-field-index="Close">766.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="49" role="row"><zg-cell aria-colindex="1" role="gridcell" value="21-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">21-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="770.6" type="number" data-field-index="Close">
              <div data-field-index="Close">770.6</div>
            </zg-cell></zg-row><zg-row aria-rowindex="50" role="row"><zg-cell aria-colindex="1" role="gridcell" value="20-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">20-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="771.22" type="number" data-field-index="Close">
              <div data-field-index="Close">771.22</div>
            </zg-cell></zg-row><zg-row aria-rowindex="51" role="row"><zg-cell aria-colindex="1" role="gridcell" value="19-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">19-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="766" type="number" data-field-index="Close">
              <div data-field-index="Close">766</div>
            </zg-cell></zg-row><zg-row aria-rowindex="52" role="row"><zg-cell aria-colindex="1" role="gridcell" value="16-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">16-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="757.77" type="number" data-field-index="Close">
              <div data-field-index="Close">757.77</div>
            </zg-cell></zg-row><zg-row aria-rowindex="53" role="row"><zg-cell aria-colindex="1" role="gridcell" value="15-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">15-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="761" type="number" data-field-index="Close">
              <div data-field-index="Close">761</div>
            </zg-cell></zg-row><zg-row aria-rowindex="54" role="row"><zg-cell aria-colindex="1" role="gridcell" value="14-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">14-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="768.82" type="number" data-field-index="Close">
              <div data-field-index="Close">768.82</div>
            </zg-cell></zg-row><zg-row aria-rowindex="55" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="774.34" type="number" data-field-index="Close">
              <div data-field-index="Close">774.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="56" role="row"><zg-cell aria-colindex="1" role="gridcell" value="12-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">12-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="760.12" type="number" data-field-index="Close">
              <div data-field-index="Close">760.12</div>
            </zg-cell></zg-row><zg-row aria-rowindex="57" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="768.66" type="number" data-field-index="Close">
              <div data-field-index="Close">768.66</div>
            </zg-cell></zg-row><zg-row aria-rowindex="58" role="row"><zg-cell aria-colindex="1" role="gridcell" value="8-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">8-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="767.33" type="number" data-field-index="Close">
              <div data-field-index="Close">767.33</div>
            </zg-cell></zg-row><zg-row aria-rowindex="59" role="row"><zg-cell aria-colindex="1" role="gridcell" value="7-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">7-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="770.42" type="number" data-field-index="Close">
              <div data-field-index="Close">770.42</div>
            </zg-cell></zg-row><zg-row aria-rowindex="60" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="764.72" type="number" data-field-index="Close">
              <div data-field-index="Close">764.72</div>
            </zg-cell></zg-row><zg-row aria-rowindex="61" role="row"><zg-cell aria-colindex="1" role="gridcell" value="5-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">5-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="759.36" type="number" data-field-index="Close">
              <div data-field-index="Close">759.36</div>
            </zg-cell></zg-row><zg-row aria-rowindex="62" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="740.34" type="number" data-field-index="Close">
              <div data-field-index="Close">740.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="63" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="743.65" type="number" data-field-index="Close">
              <div data-field-index="Close">743.65</div>
            </zg-cell></zg-row><zg-row aria-rowindex="64" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Nov-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Nov-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="750.57" type="number" data-field-index="Close">
              <div data-field-index="Close">750.57</div>
            </zg-cell></zg-row></zg-body><zg-foot id="mainfoot" slot="gridfoot"></zg-foot><zg-head id="righthead" slot="righthead" role="rowgroup"></zg-head><zg-body id="rightbody" slot="rightbody" role="rowgroup"></zg-body><zg-foot id="rightfoot" slot="rightfoot"></zg-foot><zg-footer slot="footer"></zg-footer><zg-status slot="status"></zg-status><zg-tooltip slot="tooltip" role="tooltip" hidden=""></zg-tooltip><zg-editor-row id="lefteditorrow" slot="lefteditorrow"></zg-editor-row><zg-editor-row id="bodyeditorrow" slot="bodyeditorrow"></zg-editor-row><zg-editor-row id="righteditorrow" slot="righteditorrow"></zg-editor-row><zg-editor-row id="leftheadeditorrow" slot="leftheadeditorrow"></zg-editor-row><zg-editor-row id="mainheadeditorrow" slot="mainheadeditorrow"></zg-editor-row><zg-editor-row id="rightheadeditorrow" slot="rightheadeditorrow"></zg-editor-row><zg-editor-row id="leftfooteditorrow" slot="leftfooteditorrow"></zg-editor-row><zg-editor-row id="mainfooteditorrow" slot="mainfooteditorrow"></zg-editor-row><zg-editor-row id="rightfooteditorrow" slot="rightfooteditorrow"></zg-editor-row><zg-frozen-colgroup id="zing-grid-freeze-style-left" slot="freeze-left-columns" hidden=""></zg-frozen-colgroup><zg-frozen-colgroup id="zing-grid-freeze-style-right" slot="freeze-right-columns" hidden=""></zg-frozen-colgroup><zg-load-mask default-load-mask="" hidden=""></zg-load-mask><zg-focus area="header" slot="leftheadfocus"></zg-focus><zg-focus area="header" slot="mainheadfocus"></zg-focus><zg-focus area="header" slot="rightheadfocus"></zg-focus><zg-selector-mask slot="leftgridselectmask"></zg-selector-mask><zg-focus slot="leftgridfocus" hidden=""></zg-focus><zg-selector-mask slot="bodygridselectmask"></zg-selector-mask><zg-focus slot="bodygridfocus" hidden=""></zg-focus><zg-selector-mask slot="rightgridselectmask"></zg-selector-mask><zg-focus slot="rightgridfocus" hidden=""></zg-focus><zg-focus area="footer" slot="leftfootfocus"></zg-focus><zg-focus area="footer" slot="mainfootfocus"></zg-focus><zg-focus area="footer" slot="rightfootfocus"></zg-focus><zg-no-data class="default" slot="gridnodata"><span class="default-message">There are no records to display.</span></zg-no-data><zg-dialog internal="" slot="dialogInternal"></zg-dialog><zg-watermark slot="watermark"></zg-watermark><zg-menu id="columnMenu" hidden="" role="menu"><zg-menu-item role="menuitemcheckbox" tabindex="-1"><zg-button action="checkbox" role="button" hastext="" dir="ltr"><zg-icon hidden="" name="checkbox" slot="icon"><svg id="svg--974281" slot="icon" viewBox="0 0 24 24"></svg></zg-icon><zg-checkbox checked="" slot="checkbox" action="checkbox"><zg-icon slot="zgicon" name="checked"><svg id="svg--732903" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label">Date</span></zg-button></zg-menu-item><zg-menu-item role="menuitemcheckbox" tabindex="-1"><zg-button action="checkbox" role="button" hastext="" dir="ltr"><zg-icon hidden="" name="checkbox" slot="icon"><svg id="svg--926339" slot="icon" viewBox="0 0 24 24"></svg></zg-icon><zg-checkbox checked="" slot="checkbox" action="checkbox"><zg-icon slot="zgicon" name="checked"><svg id="svg--298938" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label">Close</span></zg-button></zg-menu-item></zg-menu></zing-grid>
    
      <script>
        ZingGrid.setLicense(['26ccbfec16b8be9ee98c7d57bee6e498']);
      </script>
    </body>
    
    </html>
    <!DOCTYPE html>
    <html>
    
    <head>
      <meta charset="utf-8">
      <title>ZingGrid Demo</title>
      <script src="https://cdn.zinggrid.com/zinggrid.min.js"></script>
    </head>
    
    <body class="zg-body">
    
      <!--
          Original Markup: 
    
          <zing-grid 
            caption="Amazon Stock Data"
            search
            height="1000"
            src="https://cdn.zinggrid.com/datasets/amzn-stock-data.json">
          </zing-grid> 
    	-->
    
    
      <!-- 
    		SSR renderered markup... 
    
    		ADDED server-rendered="true" attribute for this markup, the
    		rest of the markup is just output from the browser when ZG
    		is rendered.
    	-->
    
      <zing-grid caption="Amazon Stock Data" server-rendered="true" search="" height="1000" src="https://cdn.zinggrid.com/datasets/amzn-stock-data.json" tabindex="0" viewport="desktop">
        <zg-header slot="header"><zg-caption slot="caption">
            <div id="zg-caption-user-text">Amazon Stock Data</div><zg-button data-focusable="" slot="tool" action="removerecord" hidden="" role="button" dir="ltr" tooltip="Remove Record" tooltip-left="" aria-label="Remove Record" tabindex="-1"><zg-icon name="removerecord" slot="icon" internal-caption=""><svg id="svg--548557" slot="icon" viewBox="0 0 24 24">
                  <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--911060" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-search slot="tool"><zg-button slot="button" action="search" data-focusable="" role="button" dir="ltr" tooltip="Open Search" tooltip-left="" aria-label="Open Search" tabindex="-1"><zg-icon name="search" slot="icon" internal-caption=""><svg id="svg--972529" slot="icon" viewBox="0 0 24 24">
                    <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"></path>
                    <path d="M0 0h24v24H0z" fill="none"></path>
                  </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--694516" slot="icon" viewBox="0 0 24 24">
                      <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                    </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><input slot="input" type="search" placeholder="Search" aria-label="Search" tabindex="-1"></zg-search><zg-button data-focusable="" slot="tool" action="fixedmenu" hidden="" role="button" dir="ltr" tooltip="Open Menu" tooltip-left="" aria-label="Open Menu" aria-haspopup="true" tabindex="-1"><zg-icon name="fixedmenu" slot="icon" internal-caption=""><svg id="svg--974554" slot="icon" viewBox="0 0 24 24">
                  <path d="M0 0h24v24H0z" fill="none"></path>
                  <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--933326" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="tool" action="menu" hidden="" role="button" dir="ltr" tooltip="Open Column Menu" tooltip-left="" aria-label="Open Column Menu" aria-haspopup="true" tabindex="-1"><zg-icon name="menu" slot="icon" internal-caption=""><svg id="svg--134207" slot="icon" viewBox="0 0 24 24">
                  <path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked" internal-caption=""><svg id="svg--2412" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button>
          </zg-caption><zg-control-bar slot="control-bar" hidden=""><zg-button data-focusable="" slot="action" action="createrecord" hidden="" role="button" dir="ltr" tooltip="Insert Record" tooltip-right="" aria-label="Insert Record" tabindex="-1"><zg-icon name="createrecord" slot="icon"><svg id="svg--961677" slot="icon" viewBox="0 0 24 24">
                  <path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--125296" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batchedit" hidden="" role="button" dir="ltr" tooltip="Open Batch Edit" tooltip-right="" aria-label="Open Batch Edit" tabindex="-1"><zg-icon name="batchedit" slot="icon"><svg id="svg--934318" slot="icon" viewBox="0 0 24 24">
                  <path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--642708" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batcheditsave" hidden="" role="button" dir="ltr" tooltip="Save Batch Edit" tooltip-right="" aria-label="Save Batch Edit" tabindex="-1"><zg-icon name="batcheditsave" slot="icon"><svg id="svg--569929" slot="icon" viewBox="0 0 24 24">
                  <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--5508" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><zg-button data-focusable="" slot="action" action="batcheditcancel" hidden="" role="button" dir="ltr" tooltip="Cancel Batch Edit" tooltip-right="" aria-label="Cancel Batch Edit" tabindex="-1"><zg-icon name="batcheditcancel" slot="icon"><svg id="svg--511257" slot="icon" viewBox="0 0 24 24">
                  <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path>
                </svg></zg-icon><zg-checkbox slot="checkbox" action="checkbox" hidden=""><zg-icon slot="zgicon" name="unchecked"><svg id="svg--383294" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label"></span></zg-button><span id="unsaved" slot="message" hidden=""></span></zg-control-bar></zg-header><zg-head id="lefthead" slot="lefthead" role="rowgroup"></zg-head><zg-body id="leftbody" slot="leftbody" role="rowgroup"></zg-body><zg-foot id="leftfoot" slot="leftfoot"></zg-foot><zg-colgroup id="leftcolgroup" slot="leftcolgroup"></zg-colgroup><zg-colgroup id="gridcolgroup" slot="gridcolgroup"><zg-column type="text" index="Date" min-calculated-header-width="68" min-calculated-width="107.203125" style="width: 699px;"></zg-column><zg-column type="number" index="Close" min-calculated-header-width="72" min-calculated-width="81.609375" style="width: 674px;"></zg-column></zg-colgroup><zg-colgroup id="rightcolgroup" slot="rightcolgroup"></zg-colgroup><zg-head id="mainhead" slot="gridhead" role="rowgroup"><zg-row aria-rowindex="1" role="row"><zg-head-cell cellindex="0" role="columnheader" aria-colindex="1" data-focusable="" data-field-index="Date" first="" title="" depth="1" type="text" style="left: 0px; width: 699px; line-height: 40px; height: 40px; position: absolute;" class=""><zg-icon class="zg-head-icon"></zg-icon><zg-icon class="zg-head-details-icon"></zg-icon>
              <div data-field-index="Date"><span>Date</span></div>
            </zg-head-cell><zg-head-cell cellindex="1" role="columnheader" aria-colindex="2" data-focusable="" data-field-index="Close" title="" depth="1" type="number" style="left: 699px; width: 674px; line-height: 40px; height: 40px; position: absolute;" class=""><zg-icon class="zg-head-icon"></zg-icon><zg-icon class="zg-head-details-icon"></zg-icon>
              <div data-field-index="Close"><span>Close</span></div>
            </zg-head-cell></zg-row></zg-head><zg-body id="mainbody" slot="gridbody" role="rowgroup" viewport="desktop"><zg-row aria-rowindex="2" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Mar-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Mar-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="848.91" type="number" data-field-index="Close">
              <div data-field-index="Close">848.91</div>
            </zg-cell></zg-row><zg-row aria-rowindex="3" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Mar-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Mar-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="853.08" type="number" data-field-index="Close">
              <div data-field-index="Close">853.08</div>
            </zg-cell></zg-row><zg-row aria-rowindex="4" role="row"><zg-cell aria-colindex="1" role="gridcell" value="28-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">28-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.04" type="number" data-field-index="Close">
              <div data-field-index="Close">845.04</div>
            </zg-cell></zg-row><zg-row aria-rowindex="5" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="848.64" type="number" data-field-index="Close">
              <div data-field-index="Close">848.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="6" role="row"><zg-cell aria-colindex="1" role="gridcell" value="24-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">24-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.24" type="number" data-field-index="Close">
              <div data-field-index="Close">845.24</div>
            </zg-cell></zg-row><zg-row aria-rowindex="7" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="852.19" type="number" data-field-index="Close">
              <div data-field-index="Close">852.19</div>
            </zg-cell></zg-row><zg-row aria-rowindex="8" role="row"><zg-cell aria-colindex="1" role="gridcell" value="22-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">22-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="855.61" type="number" data-field-index="Close">
              <div data-field-index="Close">855.61</div>
            </zg-cell></zg-row><zg-row aria-rowindex="9" role="row"><zg-cell aria-colindex="1" role="gridcell" value="21-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">21-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="856.44" type="number" data-field-index="Close">
              <div data-field-index="Close">856.44</div>
            </zg-cell></zg-row><zg-row aria-rowindex="10" role="row"><zg-cell aria-colindex="1" role="gridcell" value="17-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">17-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="845.07" type="number" data-field-index="Close">
              <div data-field-index="Close">845.07</div>
            </zg-cell></zg-row><zg-row aria-rowindex="11" role="row"><zg-cell aria-colindex="1" role="gridcell" value="16-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">16-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="844.14" type="number" data-field-index="Close">
              <div data-field-index="Close">844.14</div>
            </zg-cell></zg-row><zg-row aria-rowindex="12" role="row"><zg-cell aria-colindex="1" role="gridcell" value="15-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">15-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="842.7" type="number" data-field-index="Close">
              <div data-field-index="Close">842.7</div>
            </zg-cell></zg-row><zg-row aria-rowindex="13" role="row"><zg-cell aria-colindex="1" role="gridcell" value="14-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">14-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.39" type="number" data-field-index="Close">
              <div data-field-index="Close">836.39</div>
            </zg-cell></zg-row><zg-row aria-rowindex="14" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.53" type="number" data-field-index="Close">
              <div data-field-index="Close">836.53</div>
            </zg-cell></zg-row><zg-row aria-rowindex="15" role="row"><zg-cell aria-colindex="1" role="gridcell" value="10-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">10-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="827.46" type="number" data-field-index="Close">
              <div data-field-index="Close">827.46</div>
            </zg-cell></zg-row><zg-row aria-rowindex="16" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="821.36" type="number" data-field-index="Close">
              <div data-field-index="Close">821.36</div>
            </zg-cell></zg-row><zg-row aria-rowindex="17" role="row"><zg-cell aria-colindex="1" role="gridcell" value="8-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">8-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="819.71" type="number" data-field-index="Close">
              <div data-field-index="Close">819.71</div>
            </zg-cell></zg-row><zg-row aria-rowindex="18" role="row"><zg-cell aria-colindex="1" role="gridcell" value="7-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">7-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="812.5" type="number" data-field-index="Close">
              <div data-field-index="Close">812.5</div>
            </zg-cell></zg-row><zg-row aria-rowindex="19" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="807.64" type="number" data-field-index="Close">
              <div data-field-index="Close">807.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="20" role="row"><zg-cell aria-colindex="1" role="gridcell" value="3-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">3-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="810.2" type="number" data-field-index="Close">
              <div data-field-index="Close">810.2</div>
            </zg-cell></zg-row><zg-row aria-rowindex="21" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="839.95" type="number" data-field-index="Close">
              <div data-field-index="Close">839.95</div>
            </zg-cell></zg-row><zg-row aria-rowindex="22" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Feb-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Feb-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="832.35" type="number" data-field-index="Close">
              <div data-field-index="Close">832.35</div>
            </zg-cell></zg-row><zg-row aria-rowindex="23" role="row"><zg-cell aria-colindex="1" role="gridcell" value="31-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">31-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="823.48" type="number" data-field-index="Close">
              <div data-field-index="Close">823.48</div>
            </zg-cell></zg-row><zg-row aria-rowindex="24" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="830.38" type="number" data-field-index="Close">
              <div data-field-index="Close">830.38</div>
            </zg-cell></zg-row><zg-row aria-rowindex="25" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="835.77" type="number" data-field-index="Close">
              <div data-field-index="Close">835.77</div>
            </zg-cell></zg-row><zg-row aria-rowindex="26" role="row"><zg-cell aria-colindex="1" role="gridcell" value="26-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">26-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="839.15" type="number" data-field-index="Close">
              <div data-field-index="Close">839.15</div>
            </zg-cell></zg-row><zg-row aria-rowindex="27" role="row"><zg-cell aria-colindex="1" role="gridcell" value="25-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">25-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="836.52" type="number" data-field-index="Close">
              <div data-field-index="Close">836.52</div>
            </zg-cell></zg-row><zg-row aria-rowindex="28" role="row"><zg-cell aria-colindex="1" role="gridcell" value="24-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">24-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="822.44" type="number" data-field-index="Close">
              <div data-field-index="Close">822.44</div>
            </zg-cell></zg-row><zg-row aria-rowindex="29" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="817.88" type="number" data-field-index="Close">
              <div data-field-index="Close">817.88</div>
            </zg-cell></zg-row><zg-row aria-rowindex="30" role="row"><zg-cell aria-colindex="1" role="gridcell" value="20-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">20-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="808.33" type="number" data-field-index="Close">
              <div data-field-index="Close">808.33</div>
            </zg-cell></zg-row><zg-row aria-rowindex="31" role="row"><zg-cell aria-colindex="1" role="gridcell" value="19-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">19-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="809.04" type="number" data-field-index="Close">
              <div data-field-index="Close">809.04</div>
            </zg-cell></zg-row><zg-row aria-rowindex="32" role="row"><zg-cell aria-colindex="1" role="gridcell" value="18-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">18-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="807.48" type="number" data-field-index="Close">
              <div data-field-index="Close">807.48</div>
            </zg-cell></zg-row><zg-row aria-rowindex="33" role="row"><zg-cell aria-colindex="1" role="gridcell" value="17-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">17-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="809.72" type="number" data-field-index="Close">
              <div data-field-index="Close">809.72</div>
            </zg-cell></zg-row><zg-row aria-rowindex="34" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="817.14" type="number" data-field-index="Close">
              <div data-field-index="Close">817.14</div>
            </zg-cell></zg-row><zg-row aria-rowindex="35" role="row"><zg-cell aria-colindex="1" role="gridcell" value="12-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">12-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="813.64" type="number" data-field-index="Close">
              <div data-field-index="Close">813.64</div>
            </zg-cell></zg-row><zg-row aria-rowindex="36" role="row"><zg-cell aria-colindex="1" role="gridcell" value="11-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">11-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="799.02" type="number" data-field-index="Close">
              <div data-field-index="Close">799.02</div>
            </zg-cell></zg-row><zg-row aria-rowindex="37" role="row"><zg-cell aria-colindex="1" role="gridcell" value="10-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">10-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="795.9" type="number" data-field-index="Close">
              <div data-field-index="Close">795.9</div>
            </zg-cell></zg-row><zg-row aria-rowindex="38" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="796.92" type="number" data-field-index="Close">
              <div data-field-index="Close">796.92</div>
            </zg-cell></zg-row><zg-row aria-rowindex="39" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="795.99" type="number" data-field-index="Close">
              <div data-field-index="Close">795.99</div>
            </zg-cell></zg-row><zg-row aria-rowindex="40" role="row"><zg-cell aria-colindex="1" role="gridcell" value="5-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">5-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="780.45" type="number" data-field-index="Close">
              <div data-field-index="Close">780.45</div>
            </zg-cell></zg-row><zg-row aria-rowindex="41" role="row"><zg-cell aria-colindex="1" role="gridcell" value="4-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">4-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="757.18" type="number" data-field-index="Close">
              <div data-field-index="Close">757.18</div>
            </zg-cell></zg-row><zg-row aria-rowindex="42" role="row"><zg-cell aria-colindex="1" role="gridcell" value="3-Jan-17" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">3-Jan-17</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="753.67" type="number" data-field-index="Close">
              <div data-field-index="Close">753.67</div>
            </zg-cell></zg-row><zg-row aria-rowindex="43" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="749.87" type="number" data-field-index="Close">
              <div data-field-index="Close">749.87</div>
            </zg-cell></zg-row><zg-row aria-rowindex="44" role="row"><zg-cell aria-colindex="1" role="gridcell" value="29-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">29-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="765.15" type="number" data-field-index="Close">
              <div data-field-index="Close">765.15</div>
            </zg-cell></zg-row><zg-row aria-rowindex="45" role="row"><zg-cell aria-colindex="1" role="gridcell" value="28-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">28-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="772.13" type="number" data-field-index="Close">
              <div data-field-index="Close">772.13</div>
            </zg-cell></zg-row><zg-row aria-rowindex="46" role="row"><zg-cell aria-colindex="1" role="gridcell" value="27-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">27-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="771.4" type="number" data-field-index="Close">
              <div data-field-index="Close">771.4</div>
            </zg-cell></zg-row><zg-row aria-rowindex="47" role="row"><zg-cell aria-colindex="1" role="gridcell" value="23-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">23-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="760.59" type="number" data-field-index="Close">
              <div data-field-index="Close">760.59</div>
            </zg-cell></zg-row><zg-row aria-rowindex="48" role="row"><zg-cell aria-colindex="1" role="gridcell" value="22-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">22-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="766.34" type="number" data-field-index="Close">
              <div data-field-index="Close">766.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="49" role="row"><zg-cell aria-colindex="1" role="gridcell" value="21-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">21-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="770.6" type="number" data-field-index="Close">
              <div data-field-index="Close">770.6</div>
            </zg-cell></zg-row><zg-row aria-rowindex="50" role="row"><zg-cell aria-colindex="1" role="gridcell" value="20-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">20-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="771.22" type="number" data-field-index="Close">
              <div data-field-index="Close">771.22</div>
            </zg-cell></zg-row><zg-row aria-rowindex="51" role="row"><zg-cell aria-colindex="1" role="gridcell" value="19-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">19-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="766" type="number" data-field-index="Close">
              <div data-field-index="Close">766</div>
            </zg-cell></zg-row><zg-row aria-rowindex="52" role="row"><zg-cell aria-colindex="1" role="gridcell" value="16-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">16-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="757.77" type="number" data-field-index="Close">
              <div data-field-index="Close">757.77</div>
            </zg-cell></zg-row><zg-row aria-rowindex="53" role="row"><zg-cell aria-colindex="1" role="gridcell" value="15-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">15-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="761" type="number" data-field-index="Close">
              <div data-field-index="Close">761</div>
            </zg-cell></zg-row><zg-row aria-rowindex="54" role="row"><zg-cell aria-colindex="1" role="gridcell" value="14-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">14-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="768.82" type="number" data-field-index="Close">
              <div data-field-index="Close">768.82</div>
            </zg-cell></zg-row><zg-row aria-rowindex="55" role="row"><zg-cell aria-colindex="1" role="gridcell" value="13-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">13-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="774.34" type="number" data-field-index="Close">
              <div data-field-index="Close">774.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="56" role="row"><zg-cell aria-colindex="1" role="gridcell" value="12-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">12-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="760.12" type="number" data-field-index="Close">
              <div data-field-index="Close">760.12</div>
            </zg-cell></zg-row><zg-row aria-rowindex="57" role="row"><zg-cell aria-colindex="1" role="gridcell" value="9-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">9-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="768.66" type="number" data-field-index="Close">
              <div data-field-index="Close">768.66</div>
            </zg-cell></zg-row><zg-row aria-rowindex="58" role="row"><zg-cell aria-colindex="1" role="gridcell" value="8-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">8-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="767.33" type="number" data-field-index="Close">
              <div data-field-index="Close">767.33</div>
            </zg-cell></zg-row><zg-row aria-rowindex="59" role="row"><zg-cell aria-colindex="1" role="gridcell" value="7-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">7-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="770.42" type="number" data-field-index="Close">
              <div data-field-index="Close">770.42</div>
            </zg-cell></zg-row><zg-row aria-rowindex="60" role="row"><zg-cell aria-colindex="1" role="gridcell" value="6-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">6-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="764.72" type="number" data-field-index="Close">
              <div data-field-index="Close">764.72</div>
            </zg-cell></zg-row><zg-row aria-rowindex="61" role="row"><zg-cell aria-colindex="1" role="gridcell" value="5-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">5-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="759.36" type="number" data-field-index="Close">
              <div data-field-index="Close">759.36</div>
            </zg-cell></zg-row><zg-row aria-rowindex="62" role="row"><zg-cell aria-colindex="1" role="gridcell" value="2-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">2-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="740.34" type="number" data-field-index="Close">
              <div data-field-index="Close">740.34</div>
            </zg-cell></zg-row><zg-row aria-rowindex="63" role="row"><zg-cell aria-colindex="1" role="gridcell" value="1-Dec-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">1-Dec-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="743.65" type="number" data-field-index="Close">
              <div data-field-index="Close">743.65</div>
            </zg-cell></zg-row><zg-row aria-rowindex="64" role="row"><zg-cell aria-colindex="1" role="gridcell" value="30-Nov-16" type="text" data-field-index="Date" first="">
              <div data-field-index="Date">30-Nov-16</div>
            </zg-cell><zg-cell aria-colindex="2" role="gridcell" value="750.57" type="number" data-field-index="Close">
              <div data-field-index="Close">750.57</div>
            </zg-cell></zg-row></zg-body><zg-foot id="mainfoot" slot="gridfoot"></zg-foot><zg-head id="righthead" slot="righthead" role="rowgroup"></zg-head><zg-body id="rightbody" slot="rightbody" role="rowgroup"></zg-body><zg-foot id="rightfoot" slot="rightfoot"></zg-foot><zg-footer slot="footer"></zg-footer><zg-status slot="status"></zg-status><zg-tooltip slot="tooltip" role="tooltip" hidden=""></zg-tooltip><zg-editor-row id="lefteditorrow" slot="lefteditorrow"></zg-editor-row><zg-editor-row id="bodyeditorrow" slot="bodyeditorrow"></zg-editor-row><zg-editor-row id="righteditorrow" slot="righteditorrow"></zg-editor-row><zg-editor-row id="leftheadeditorrow" slot="leftheadeditorrow"></zg-editor-row><zg-editor-row id="mainheadeditorrow" slot="mainheadeditorrow"></zg-editor-row><zg-editor-row id="rightheadeditorrow" slot="rightheadeditorrow"></zg-editor-row><zg-editor-row id="leftfooteditorrow" slot="leftfooteditorrow"></zg-editor-row><zg-editor-row id="mainfooteditorrow" slot="mainfooteditorrow"></zg-editor-row><zg-editor-row id="rightfooteditorrow" slot="rightfooteditorrow"></zg-editor-row><zg-frozen-colgroup id="zing-grid-freeze-style-left" slot="freeze-left-columns" hidden=""></zg-frozen-colgroup><zg-frozen-colgroup id="zing-grid-freeze-style-right" slot="freeze-right-columns" hidden=""></zg-frozen-colgroup><zg-load-mask default-load-mask="" hidden=""></zg-load-mask><zg-focus area="header" slot="leftheadfocus"></zg-focus><zg-focus area="header" slot="mainheadfocus"></zg-focus><zg-focus area="header" slot="rightheadfocus"></zg-focus><zg-selector-mask slot="leftgridselectmask"></zg-selector-mask><zg-focus slot="leftgridfocus" hidden=""></zg-focus><zg-selector-mask slot="bodygridselectmask"></zg-selector-mask><zg-focus slot="bodygridfocus" hidden=""></zg-focus><zg-selector-mask slot="rightgridselectmask"></zg-selector-mask><zg-focus slot="rightgridfocus" hidden=""></zg-focus><zg-focus area="footer" slot="leftfootfocus"></zg-focus><zg-focus area="footer" slot="mainfootfocus"></zg-focus><zg-focus area="footer" slot="rightfootfocus"></zg-focus><zg-no-data class="default" slot="gridnodata"><span class="default-message">There are no records to display.</span></zg-no-data><zg-dialog internal="" slot="dialogInternal"></zg-dialog><zg-watermark slot="watermark"></zg-watermark><zg-menu id="columnMenu" hidden="" role="menu"><zg-menu-item role="menuitemcheckbox" tabindex="-1"><zg-button action="checkbox" role="button" hastext="" dir="ltr"><zg-icon hidden="" name="checkbox" slot="icon"><svg id="svg--974281" slot="icon" viewBox="0 0 24 24"></svg></zg-icon><zg-checkbox checked="" slot="checkbox" action="checkbox"><zg-icon slot="zgicon" name="checked"><svg id="svg--732903" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label">Date</span></zg-button></zg-menu-item><zg-menu-item role="menuitemcheckbox" tabindex="-1"><zg-button action="checkbox" role="button" hastext="" dir="ltr"><zg-icon hidden="" name="checkbox" slot="icon"><svg id="svg--926339" slot="icon" viewBox="0 0 24 24"></svg></zg-icon><zg-checkbox checked="" slot="checkbox" action="checkbox"><zg-icon slot="zgicon" name="checked"><svg id="svg--298938" slot="icon" viewBox="0 0 24 24">
                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                  </svg></zg-icon></zg-checkbox><span class="label" slot="label">Close</span></zg-button></zg-menu-item></zg-menu></zing-grid>
    
    </body>
    
    </html>
    .zg-body {
      background: #e6e6e6;
    }
    
    zing-grid {
      overflow: hidden;
    }