Instance Properties
activeCellDOM. Dom object of current active cell. Read only.
activeRecordObject or Array. Data set of current active row. Read only.
clickStartEditBool. To specify whether cell becomes editable once it is clicked. If this flag set to false, user need to click once more to edit an active cell.
columnListArray. Array of all the column objects. Read only.
columnMapObject. Object of column objects in in key-value formate, where key is column id and value is column object. Read only.
containerSting or DOM.
Id or dom object which grid is built up based on. Generally, container should be div or span. Sample
<div id="gridcontainer"> </div>
container:gridcontainer
customHeadString or DOM.
Id, dom object or HTML code of a table, which defines layout of grid header.
Sample1 - to guade to build a grid header with submit button
<table id="gridHead1">
<tr><td>Column1</td><td>Column2</td></tr>
<tr><td><input type="button" value="submit"></td><td>Column2</td></tr>
</table>
customHead:gridHead1
Sample2 - to guade to build a nested header
<table id="gridHead1">
<tr><td>Column1</td><td colspan="2">Column2</td></tr>
<tr><td>Column1 Sub</td><td>Column2 Sub1</td><td>Column2 Sub2</td></tr>
</table>
customHead:gridHead1
debugBool. To specify grid to be in debug mode. To be in debug mode can call out a console with more info printed.
defaultRecordObject or Array.
Data record template. This template will be adopted if a new row is added or appended.
Sample - When a row is added, it is initialized with "somebody", 0, 25 in column1, comlumn2, and comlumn3 respectively.
defaultRecord:["somebody", 0, 25]
If data type is object, it should be
defaultRecord:{name:"somebody", field:0, moreField:25]
groupableBool. To specify whether grouping menu is enabled. If this flag is set true, grouping menu will appears in main menu and grouping functionality is enabled.
heightInteger or String.
Height of whole grid. Pixel and percentage are supported. Sample
height:200
width:100%
idString. Id of grid. Every grid should have unique id if more than one grid appear on same page.
Sample
id : "sigmagrid1"
jsonParamNameString. To specify parameter name submitted to server side. It's set to "_gt_json" by default. For example, PHP developer could get whole JSON string by $_POST["_gt_json"] in php.
languageString. Language option.
By default, messages on toolbar, on menu, of warning are in english. These words for presentation are defined in a language file named gt_msg_en.js. Developer can work out profile of other language. Take Spaish for example, developer need two steps.
1. Work out language file named gt_msg_sp.js and put into the directory where gt_msg_en.js is.
2. Specify language of grid to be sp.
Sample
language:"sp"
lightOverRowBool. To specify whether to hightlight one row when mouse is hovering over it.
loadUrlString. Url which grid data is loaded from. A function could also be assigned to loadUrl.
Sample1 - To assign a real url to loadUrl.
loadUrl:"http://localhost/server/getStudentsInfo.php'
Sample2 - To assign a call back function to loadUrl.
function getTestData(grid) {
var responseT={};
var pageInfo= grid.getPageInfo();
responseT[grid.CONST.data]=__TEST_DATA__.slice( pageInfo.startRowNum-1,pageInfo.endRowNum);
responseT[grid.CONST.pageInfo]={totalRowNum :__TEST_DATA__.length } ;
return responseT;
}
loadUrl:getTestData
minHeightInteger. To specify minimum height if grid can be resized by end user.
minWidthInteger. To specify minimum width if grid can be resized by end user.
pageInfoObject Page info of grid. See Sigma.Grid.PageInfo
reloadAfterSaveBool. To specify whether grid data is reloaded after data being saving.
remoteFilterBool. To specify whether server side does filtering work.
remotePagingBool. To specify whether server side does paging work.
remoteSortBool. To specify whether server side does sorting work.
replaceContainerBool.
To specify whether container is placed with grid. If not, grid will be a child of container. Sample
replaceContainer:false
resizableBool. To specify grid be resized by end user. If this flage to be set true, a resizing handle will appears at right-bottom corner. End user could resize grid by dragging this handle.
saveUrlString. Url which grid data is saved to.
Sample
saveUrl:"http://localhost/server/saveStudentsInfo.php'
selectedRowsArray. Array of selected row objects. Read only.
showAddToolBool. To specify whether "Add" button shows up.
showDelToolBool. To specify whether "Delete" button shows up.
showIndexColumnBool. To specify whether to show row number at front of every row.
showSaveToolBool. To specify whether "Save" button shows up.
stripeRowsBool. To specify whether to show rows in stripe.
widthInteger or String.
Width of whole grid. Pixel and percentage are supported. Sample
width:500
width:100%
Instance Methods
addParameters:function(parameters)To add an additional parameter pair for submittal. By default, only data defined here will be submitted to server side. By this function, developers could add more parameter pairs.
parameters: Addtional parameters in key-value formate.
Sample
addParameters({morekey1:"more value",morekey2:"more value"})
filterGrid:function()Apply filter to this grid. Developer need to specify filterInfo before calling this function. Only records meeting filter criteria will be displayed within grid.
getColumn:function(colNoIdTd)Get column object by column id or DOM object of cell.
colNoIdTd: Column id or DOM object of cell.
returns: Column object.
getColumnValue:function(colID,rowNo) Set cell value by specifying column id and row number.
colID: string. Id of column where cell is in.
rowNo: integer. Number of row where cell is at.
returns: any. New cell value.
Sample
var ret = grid.getColumnValue("col1",1);
onShow:function()To show grid. This function must be called when a hidden grid becomes visible.
setColumnValue:function(colID,rowNo,newValue) Set cell value by specifying column id and row number.
colID: string. Id of column where cell is in.
rowNo: integer. Number of row where cell is at.
newValue: any. New cell value.
Sample
grid.setColumnValue("col1",1,"value11");
toolbarContext String. It's set to 'nav | pagesize | reload | add del save | print | filter chart | info' by default.
Developer can change its order.
Events
beforeDelete:function(record) Fired before: A row is to be deleted.
record: Object or Array. Record of the row to be deleted.
returns: Bool. Return false to prevent row from being deleted.
beforeInsert:function(record) Fired before: Changed data is to be posted to server side.
record: Object or Array. Record of the row added/appended by end user.
returns: Bool. Return false to prevent row from being posted to server side.
beforeSelectRow:function(value, record , cell, row, colNO, rowNO, columnObj,grid)Called before: End user selects one row.
value: Value of the cell where mouse pointer is at.
record: Object or array. Data record of the row to be selected.
cell: Dom of the cell where mouse pointer is at.
row: Dom of row to be selected.
colNo: Index of the column where mouse pointer is at.
columnObj: Column object.
grid: Grid object.
returns: Boolean. Return false to prevent row from being selected.
beforeUpdate:function(record,fieldName,newValue)Fired before: Changed data is to be posted to server side.
record: Object or Array. Record of the row modified by end user.
fieldName: String. Id of column changed.
newValue: New value.
returns: Bool. Return false to prevent row from being posted to server side.
onClickCell:function(value, record , cell, row, colNO, rowNO,columnObj,grid)Called before: End user click one cell.
value: Value of the cell where mouse pointer is at.
record: Object or array. Data record of the row where the cell is at.
cell: Dom of the cell.
row: Dom of row where the cell is at.
colNo: Index of the column where the cell is at.
columnObj: Column object.
grid: Grid object.
returns: Boolean. Return false to prevent cell from being active.