EasyUI
Columns Extension
Extension » Columns Extension
Include 'columns-ext.js' file
Events
The events extend from datagrid, below is the added events for datagrid.
Name | Parameters | Description |
---|---|---|
onBeforeDragColumn | field | Fires before drag a column, return false to deny drag. |
onStartDragColumn | field | Fires when start dragging a column. |
onStopDragColumn | field | Fires when stop dragging a column. |
onBeforeDropColumn | toField, fromField, point |
Fires before dropping a column, return false to deny drop. toField: The column being targeted for the drop. fromField: the source column. point: indicate the drop operation, posible values are: 'before' or 'after'. |
onDropColumn | toField, fromField, point |
Fires when dropping a column. toField: The column being targeted for the drop. fromField: the source column. point: indicate the drop operation, posible values are: 'before' or 'after'. |
Methods
The methods extend from datagrid.
Name | Parameter | Description |
---|---|---|
columnMoving | none | Enable the column moving. This method allows the user to drag and drop the columns. |
freezeColumn | field | Freeze a column. |
unfreezeColumn | field | Unfreeze a column. |
moveColumn | param |
Move a column.
Code example: $('#dg').datagrid('moveColumn', { field: 'itemid', before: 'listprice' // after: 'listprice' }); |
reorderColumns | fields |
Reorder the columns.
Code example: $('#dg').datagrid('reorderColumns',['listprice','productid']) |
Methods
The methods extend from treegrid.
Name | Parameter | Description |
---|---|---|
groupData | param |
Group data on special columns.
Code example: $('#tg').treegrid('groupData', { data: data, fields: ['country','city'], groupHeader: '#fc' }); |