Make grid tag

• declare html tag for grid

<div id="grid1" style="width: 100%; height: 300px;"></div>

Make data

• TbsGrid only allows Json Data

let data = [];
data[0] = {"custcd": "00001",    "usernm": "Anthony",    "custnm": "customer_000",    "bizno": "10-123-0000001",    "ceo": "James",    "tel": "0101-1234-00001",    "email": "email_00001@tobesimple.net",    "saddr": "Pennsylvania",    "addr": "Pennsylvania1 00001",    "creditamt": "600",    "payamt_d": "100",    "getamt_d": "200",    "useyn": "Y",    "custnote": null};
data[1] = {"custcd": "00002",    "usernm": "Anthony",    "custnm": "customer_000",    "bizno": "10-123-0000002",    "ceo": "John",    "tel": "0101-1234-00002",    "email": "email_00002@tobesimple.net",    "saddr": "New Jersey",    "addr": "New Jersey2 00002",    "creditamt": "600",    "payamt_d": "100",    "getamt_d": "200",    "useyn": "N",    "custnote": null};

Set data in grid

• data : json data
• grid.setData(data) : data binding function

// Examples
let columns = [
      { name : "custcd"     , header: { text:"Code"          }, width : 100 }
    , { name : "usernm"     , header: { text:"Manager"       }, width : 100 }
    , { name : "custnm"     , header: { text:"Customer"      }, width : 100 }
    , { name : "bizno"      , header: { text:"Biz Number"    }, width : 100 }
    , { name : "ceo"        , header: { text:"ceo"           }, width : 100 }
    , { name : "tel"        , header: { text:"Telephone"     }, width : 100 }
    , { name : "email"      , header: { text:"E-Mail"        }, width : 100 }
    , { name : "saddr"      , header: { text:"Area"          }, width : 100 }
    , { name : "addr"       , header: { text:"Address"       }, width : 100 }
    , { name : "creditamt"  , header: { text:"Credit limit"  }, type : 'number', scale : '18,2' }
    , { name : "payamt_d"   , header: { text:"Other Payable" }, type : 'number', scale : '18,2' }
    , { name : "getamt_d"   , header: { text:"Accounts receivable"}, type : 'number', scale : '18,2' }
    , { name : "useyn"      , header: { text:"Use"           }, width : 60  }
    , { name : "custnote"   , header: { text:"note"          }, width : 100 }
];

let grid1 = new TbsGrid('grid1');

let options = {};
grid1.setGrid(columns, options);
grid1.setData(data); //data binding