5 (100%) 1 vote

UI Bookmark component is a Listing/Grid Secondary Component. It is used to store active and changed states of data grids. It includes state of filters, columns position, applied sorting, pagination, and so on.

It uses DB as persistent storage for grid`s state. You can find the table “ui_bookmark” to see it.

UI Bookmark component
UI Bookmark component
  • You can take a look at the file \vendor\magento\module-ui\view\base\ui_component\etc\definition.xml to see the  Bookmarks JS Component Structure. It has component Magento_Ui/js/grid/controls/bookmarks/bookmarks which located at app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\bookmarks.js. This component uses the template app\code\Magento\Ui\view\base\web\templates\grid\controls\bookmarks\bookmarks.html.
  • The UI Bookmark component has a child element which represent a separate view located at app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\view.js and template for child element at app\code\Magento\Ui\view\base\web\templates\grid\controls\bookmarks\view.html
  • The UI Bookmark component uses  app\code\Magento\Ui\view\base\web\js\grid\controls\bookmarks\storage.js to custom data storage which allows saving bookmark state externally (saved bookmarks are available on any device and in any browser).
  • The UI Bookmark component provides the template option, component option and storageConfig option.

You can use the UI Bookmark component likes this example:

The steps I mention above is the shortest process for you to do UI Bookmark Component in Magento 2 (even in Magento 2.3).

Thank you for reading this post and see you in other posts from Magestore!

How to use Memcache in Magento 2 in Ubuntu - Magento 2.3
How to Verify Magento 2 Source Code with M2 Coding Sniffer (Magento 2.3)