jquery.edit-table.js Developer's Site

ewai.info | github | Issues

Nomal | Import Data | Export Data | Option

Demo - Option

Javascript Code

$(function() {
  $('#editTable').editTable({
    datepicker:false,
    comma:true,
    cellWidth:80,
    cellHeight:40,
    sideHead:false,
    autoRowNum:true,
    headerIds:["OrderDate","Id","Name","Type","Amount","Used"],
    headerNames:["OrderDate","BookId","BookName","BookType","Amount","Used"],
    types:["Date", "String","String","Select","Number","Checkbox"],
    datas:[
        ["2013/02/14","Item-1","Book A","",0,false],
        ["2013/02/21","Item-2","Book B","hardback",4500,false],
        ["2013/02/23","Item-3","Book C","comic",250,true]
      ],
    selects:{3:["novel","comic","hardback"]}
  });
});

HTML Code

<table id="editTable">
</table>

Option

Option Set value Explained
datepicker true/false When a Type is Date, datepicker
comma true/false When a Type is Number, auto comma
cellWidth Number cell width size
cellHeight Number cell height size
sideHead true/false Is left side number?
autoRowNum true/false left side is auto number.
headerIds Cell Type It sets up for every sequence.
headerNames Header Name
types Cell Type
Date, String, Select, Number, Checkbox
It sets up for every sequence.
datas Cell Data [[xx, xx, xx], [xx, xx, xx]]
selects When Type select is select list. [ 'select cell index' : [xx, xx, xxx]]