If you want the columns in the grid to be in different order or visibility, than they are by default, you need to provide that order in a config variable as shown below.
All grid columns must be defined in this config variable, no matter if they are hidden or not.
For changing the column configuration like width, hidden etc., the appropriate properties are provided in the configuration variable for this column.
The column id in the column configuration variable (stateId in the extjs grid column configuration) must be defined for the each grid column in the code.
For this purpose there is a Zf_configuration variable which you have to use to provide the configuration. It's name is:
runtimeOptions.frontend.defaultState
For the segment grid there exist two ways to influence columns visibility:
- setting runtimeOptions.segments.disabledFields → BaseMixin.js
- Workflow Settings column visibility
The easyest way to get the columns configuration is to use grid 'getState()' method.
ex:
Ext.ComponentQuery.query('#adminUserGrid')[0].getState();
This will return the column state configuration for the adminUserGrid.
For get the configuration as string we can use the JSON.stringify()
Here is an example of config variable:
{ "#adminUserGrid": -> the selector for the grid where this configuration will be applied. In this example the order of the colums is important for us, that is why all of the columns are defined in the desired order { "columns":[{ "id":"targetLanguage", -> column stateId "width":100 },{ "id":"sourceLanguage", "width":100 },{ "id":"roles" },{ "id":"gender" },{ "id":"surName" },{ "id":"email" },{ "id":"login" },{ "id":"firstName" },{ "id":"userGridActionColumn" }] }, "#adminTaskGrid": -> secound selector for another grid { "columns":[{ "id":"taskName","hidden":true },{ "id":"taskGuid","hidden":true }] } }