Documentation

Component parameters

Below are all grid component parameters (main.ui.grid).

Required parameters

ParameterTypeDescription
GRID_IDstringGrid identifier, unique for each grid within a single page.
COLUMNSarraySet of Grid columns.
ROWSarrayGrid rows.
AJAX_MODEstringValue must have set as Y.
AJAX_OPTION_JUMPstringValue must have set as N.
AJAX_OPTION_HISTORYstringValue must have set as N.

Additional parameters

ParameterTypeDescription
NAV_STRINGstringPage navigation as HTML string.
NAV_OBJECT\Bitrix\Main\UI\PageNavigation / CDBResultPage navigation page or CDBResult object.
~NAV_PARAMSarrayParameters for page navigation component (main.pagenavigation). Used jointly with the parameter NAV_OBJECT.
NAV_PARAM_NAMEstringParameter name to pass page number.
CURRENT_PAGEintCurrent page number. Necessary for correct operation of the "Load more" button.
ENABLE_NEXT_PAGEbooleanDefines, if the next page is available. Parameter is needed for correct operation of the "Load more" button.
ENABLE_COLLAPSIBLE_ROWSbooleanEnables a collapsible rows grouping.
TOTAL_ROWS_COUNTintNumber of rows on all pages.
TOTAL_ROWS_COUNT_HTMLstringAllows printing a custom counter with general number of rows. For example, just as in CRM, where total string count is displayed with a lazy loading upon clicking on a link.
PAGE_SIZESarrayArray with items for drop-down list with selection of page size. 
'PAGE_SIZES' => [
	[
		'NAME' => 20,
		'VALUE' => 20,
	],
	[
		'NAME' => 40,
		'VALUE' => 40,
	],
	...,
],
SETTINGS_WINDOW_TITLEstringTitle for grid settings popup.
COLUMNS_ALL_WITH_SECTIONSarrayList with columns with sections, for grid settings popup.
HEADERS_SECTIONSarrayColumn sections for grid settings popup.
ENABLE_FIELDS_SEARCHstringEnables option to search columns in grid settings.
TOP_ACTION_PANEL_RENDER_TOstringDefines where to display BX.UI.ActionPanel. Receives function name as value which returns link to DOM element.
TOP_ACTION_PANEL_PINNED_MODEstringDefines parameter pinnedMode, for BX.UI.ActionPanel.
TOP_ACTION_PANEL_CLASSstringDefines CSS class for BX.UI.ActionPanel.
ACTION_PANELarraySet of actions/elements for panel containing group actions, or for BX.UI.ActionPanel.
ACTION_PANEL_OPTIONSarrayAdditional parameters for BX.UI.ActionPanel. As of the moment, only available parameter is MAX_HEIGHT.
DEFAULT_PAGE_SIZEintPage size by default.
STUBstring / arrayEmpty grid stub. Can receive HTML string, or an array. 
'STUB' => [
	'title' => string,
	'description' => string,
],
LAZY_LOADarrayEnables lazy loading for list of columns. 
'LAZY_LOAD' => [
	'CONTROLLER' => 'my.controller.name',
],
SHOW_CHECK_ALL_CHECKBOXESbooleanAllows displaying "Select all" checkbox.
SHOW_ROW_CHECKBOXESbooleanAllows displaying checkboxes for rows.
SHOW_ROW_ACTIONS_MENUbooleanAllows displaying row actions menu.
SHOW_GRID_SETTINGS_MENUbooleanAllows displaying grid settings menu (button with cogwheel).
SHOW_MORE_BUTTONbooleanAllows displaying "Load more" button.
SHOW_NAVIGATION_PANELbooleanAllows displaying navigation panel button. (Page navigation, size and etc.)
SHOW_PAGINATIONbooleanAllows displaying page navigation.
SHOW_SELECTED_COUNTERbooleanAllows displaying selected rows counter.
SHOW_TOTAL_COUNTERbooleanAllows displaying total rows counter on all pages.
SHOW_PAGESIZEbooleanAllows displaying drop-down list with selection of page size.
SHOW_ACTION_PANELbooleanAllows displaying group actions panel.
SHOW_GROUP_EDIT_BUTTONbooleanAllows displaying standard "Edit" button at the group action panel.
SHOW_GROUP_DELETE_BUTTONbooleanAllows displaying standard "Delete" button at the group action panel.
SHOW_SELECT_ALL_RECORDS_CHECKBOXbooleanDisplays or hides checkbox with selection of all rows, on all pages. By default, checkbox is hidden.
ALLOW_COLUMNS_SORTbooleanAllows sorting columns by drag-and-dropping.
ALLOW_ROWS_SORTbooleanAllows sorting of rows by drag-and-dropping.
ALLOW_ROWS_SORT_IN_EDIT_MODEbooleanAllows row sorting by editing in a inline editing mode.
ALLOW_EDIT_SELECTIONbooleanAllows selecting rows in the inline editing mode.
ALLOW_ROWS_SORT_INSTANT_SAVEbooleanAllows saving rows sorting immediately after drag-and-dropping them.
ALLOW_STICKED_COLUMNSbooleanAllows pinning columns with parameter sticked during horizontal scrolling.
ALLOW_COLUMNS_RESIZEbooleanAllows changing column size.
ALLOW_HORIZONTAL_SCROLLbooleanAllows horizontal scrolling, if grid doesn't fit by width.
ALLOW_SORTbooleanAllows sorting upon clicking at column title.
ALLOW_PIN_HEADERbooleanAllows pining grid header to the browser's window top on scrolling.
ALLOW_INLINE_EDITbooleanAllows inline editing for rows.
ALLOW_CONTEXT_MENUbooleanAllows printing context menu on right mouse button clicking on the string.
HANDLE_RESPONSE_ERRORSbooleanEnables mode for additional response processing. In this mode, grid checks, if the backend's response will contain the messages array. If yes, grid displays these messages in a popup.

Please note, that despite the parameter is named HANDLE_RESPONSE_ERRORS, messages contain details not only about errors, but on successful saving and etc.

'messages' => [
	[
		'TITLE' => string,
		'TEXT' => string,
		'TYPE' => 'error' | 'warning' | 'info' | 'success',
	],
	...,
],
ALLOW_VALIDATEbooleanEnables validation mode for saved values during inline editing. In this mode, before sending query for saving, sends an additional query validate. In case, response doesn't contain the array messages or it's empty - the grid then executes the next query for saving. Otherwise, grid will print a popup with messages from messages.
TILE_GRID_MODEbooleanEnables grid display.
JS_CLASS_TILE_GRID_ITEMbooleanAllows redefining JS-class for element.
ROW_LAYOUTarrayDeclarative template of the row. Allows printing rows with complex layout into the grid, with rowspan and colspan. 
$rowLayout = [
	[
		['column' => 'col_0', 'rowspan' => 2],
		['column' => 'col_1'],
		['column' => 'col_2'],
		['column' => 'col_3']
	],
	[
		['data' => 'data_field_5', 'colspan' => 3],
	],
];

Such template must be equivalent to HTML layout.

<tr>
	<td rowspan="2"></td>
	<td></td>
	<td></td>
	<td></td>
</tr>
<tr>
	<td colspan="3"></td>
</tr>



© «Bitrix24», 2001-2024
Up