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'
});
|
