Via system configuration it is possible to customize the default configuration of these 2 tabluar views (for other tabular views this could also be enabled with some development).

It is possible to adjust the column width, the column order and if a column is hidden or visible by default.

Setting the visibility

To define, if a column should be hidden, use the hidden attribute as shown in the example above. If you want to show it instead by default, set hidden to false. 

Setting width

To set the width, use the width attribute as shown in the example above. Please note, that some columns have a defined minimum width. Where this is the case, a width that is set in the config and that is smaller than the minimum width set in the application itself will be ignored.

Setting the order

For defining the order of the columns, all columns that exist in the table must be listed in the configuration. If you do not list all columns in your configuration, only the visibility of the listed columns and their width will be adjusted but the order of your configuration will be irrelevant.

How to build a configuration the easy way

1. Open the tabular view in question in translate5
2. Adjust its configuration in a way that it suits your needs
3. Open the console in Firefox or Chrome by pressing F12
4. Query the grid configuration by executing one of the following queries in the console:
   1. For the user management table: Ext.ComponentQuery.query('#adminUserGrid')[0].getState();
   2. For the task management table: Ext.ComponentQuery.query('#adminTaskGrid

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

...

1. 1. ')[0].getState();

...

1. Copy the result and reformat it in a way that it fits the code example shown below
2. Open the database table Zf_configuration for editing and search for the row where name = "runtimeOptions.frontend.defaultState".
3. Set the value of this row to a JSON object analogous to the example shown below

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
		}]
	}
}