const grid = new gridjs.Grid({
  columns: [
  {
    id: "EMPNO",
    name: "従業員番号"
  },
  {
    id: "ENAME",
    name: "従業員名"
  },
  {
    id: "JOB",
    name: "ジョブ"
  },
  {
    id: "SAL",
    name: "給与"
  },
  {
    id: "COMM",
    name: "手当"
  },
  {
    id: "HIREDATE",
    name: "採用日"
  }
  ],
  server: {
    url: "&G_DATA_SOURCE_URL.",
    data: (opts) => {
      return new Promise((resolve, reject) => {
        // let's implement our own HTTP client
        const xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
          if (this.readyState === 4) {
            if (this.status === 200) {
              const resp = JSON.parse(this.response); 
              // columnsのidを含めているのでJSONをそのまま返す。
              resolve( resp );
            } else {
              reject();
            }
          }
        };
        xhttp.open("GET", opts.url, true);
        xhttp.setRequestHeader("Apex-Session", apexSession);
        xhttp.send();
      });
    }
  }
  /* ,
  pagination: {
    limit: 5
  }
*/
}).render(document.getElementById("grid"));

// グリッドをリフレッシュする。
apex.actions.add([
{
    name: "force-render",
    action: function ( event, element, args ) {
        grid.forceRender();
    }
}
]);