UI Bookmark component
Bookmark Component is responsible for storing active and changed states of data grids. It includes state of filters, columns position, applied sorting, pagination, and so on.
Bookmark Component use DB as persistence storage for grid`s state.
Field name | Type | Description |
---|---|---|
(PK) bookmark_id | int(10) | Bookmark identifier |
(UX1) user_id | int(10) | User Id |
(UX1) namespace | varchar(255) | Bookmark namespace |
(UX1) identifier | varchar(255) | Bookmark identifier |
current | smallint(6) | Mark current bookmark per user, namespace and identifier |
title | varchar(255) | Bookmark title |
config | longtext | Bookmark config (JSON config for Js Bookmark component) |
created_at | datetime | Bookmark created at time |
updated_at | datetime | Bookmark updated at time |
PK - increment Id
UX1 - unique key
Bookmarks JS Component Structure
Bookmark component consists of
-
Collection of bookmarks located at
app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\bookmarks.js
Template for collection at
app\code\Magento\Ui\view\base\web\templates\grid\controls\bookmarks\bookmarks.html
-
Child elements which represent a separate view located at
app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\view.js
Template for child element at
app\code\Magento\Ui\view\base\web\templates\grid\controls\bookmarks\view.html
Bookmarks use app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\storage.js
custom data storage which allows saving bookmark state externally (saved bookmarks are available on any device and in any browser).
The Bookmark component provides the following options:
- template option
- component option
templates: { view: { component: 'Magento_Ui/js/grid/controls/bookmarks/view' template: 'path/to/template' }, newView: { label: 'New View', index: '${ Date.now() }' } }
- storageConfig option
storageConfig: { saveUrl: 'path/to/save', deleteUrl: 'path/to/delete', namespace: 'namespace' }
Find us on