enables/disables horizontal resizing of columns
webix.ui({
view:"datatable",
resizeColumn:true
});
// define the size of area where resizing can start
webix.ui({
view:"datatable",
resizeColumn:{size:6}
});
// allow resizing only in the header
webix.ui({
view:"datatable",
resizeColumn:{headerOnly:true}
});
By default, the parameter is disabled.
When enabled, the method doesn't actually resize the datatable. After a page is refreshed, the size returns to the initial one (provided that you haven't saved the state of the table).
To change a column size, the user must drag its right border. To spread the area, where the mouse pointer can grab and drag the border, define the size in pixels (the example above).
DataTables in Material and Mini skins have no borders by default. To restore the borders, make use of the following configuration options:
You can disable resizing of a particular column by setting its resize property to false:
webix.ui({
view:"datatable",
// enable columns resizing
resizeColumn: true,
columns:[
// disable resizing of the "rank" column
{ id:"rank", resize:false, header:"", css:"rank", width:50},
{ id:"title", header:"Film title", fillspace:true},
// ...
],
});
Related sample: Datatable: Deny Resizing for a Column