Bài viết này sẽ hướng dẫn các bạn thêm một column edit trong grid listing ở admin.
Bước 1
Ở grid đã tạo ở bài MAGENTO 2 TẠO GRID ĐỂ QUẢN LÝ DỮ LIỆU VỚI UI COMPONENT chúng ta thêm một đoạn code như bên dưới để tạo thêm một column:
ViMagento/HelloWorld/view/adminhtml/ui_component/helloworld_post_listing.xml
|
1 2 3 4 5 6 7 8 9 10 |
<?xml version="1.0" encoding="UTF-8"?> <listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd"> <columns name="helloworld_post_columns"> <actionsColumn name="actions" class="ViMagento\HelloWorld\Ui\Component\Listing\Grid\Column\Action"> <settings> <indexField>post_id</indexField> </settings> </actionsColumn> </columns> </listing> |
Lưu ý là actionsColumn phải đặt trong thẻ columns nhé.
Bước 2
Tạo file ViMagento/HelloWorld/Ui/Component/Listing/Grid/Column/Action.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
<?php namespace ViMagento\HelloWorld\Ui\Component\Listing\Grid\Column; use Magento\Framework\View\Element\UiComponent\ContextInterface; use Magento\Framework\View\Element\UiComponentFactory; use Magento\Ui\Component\Listing\Columns\Column; use Magento\Framework\UrlInterface; /** * Class Action * @package ViMagento\HelloWorld\Ui\Component\Listing\Grid\Column */ class Action extends Column { /** * @var UrlInterface */ protected $urlBuilder; /** * Action constructor. * @param UrlInterface $urlBuilder * @param ContextInterface $context * @param UiComponentFactory $uiComponentFactory * @param array $components * @param array $data */ public function __construct( UrlInterface $urlBuilder, ContextInterface $context, UiComponentFactory $uiComponentFactory, array $components = [], array $data = [] ) { $this->urlBuilder = $urlBuilder; parent::__construct($context, $uiComponentFactory, $components, $data); } /** * Prepare Data Source * * @param array $dataSource * @return array */ public function prepareDataSource(array $dataSource) { if (isset($dataSource['data']['items'])) { foreach ($dataSource['data']['items'] as & $item) { $item[$this->getData('name')] = [ 'edit' => [ 'href' => $this->urlBuilder->getUrl('helloworld/post/addnew', ['id' => $item['post_id']]), 'label' => __('Edit') ] ]; } } return $dataSource; } } |
Bước 3
Xóa cache php bin/magento cache:clean và refesh lại trang.
Khi chúng ta nhấn vào edit sẽ được điều hướng đến trang edit tương ứng.
Mặt khác bạn cũng có thể tạo nhiều action như sau:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 |
<?php namespace ViMagento\HelloWorld\Ui\Component\Listing\Grid\Column; use Magento\Framework\View\Element\UiComponent\ContextInterface; use Magento\Framework\View\Element\UiComponentFactory; use Magento\Ui\Component\Listing\Columns\Column; use Magento\Framework\UrlInterface; /** * Class Action * @package ViMagento\HelloWorld\Ui\Component\Listing\Grid\Column */ class Action extends Column { /** * @var UrlInterface */ protected $urlBuilder; /** * Action constructor. * @param UrlInterface $urlBuilder * @param ContextInterface $context * @param UiComponentFactory $uiComponentFactory * @param array $components * @param array $data */ public function __construct( UrlInterface $urlBuilder, ContextInterface $context, UiComponentFactory $uiComponentFactory, array $components = [], array $data = [] ) { $this->urlBuilder = $urlBuilder; parent::__construct($context, $uiComponentFactory, $components, $data); } /** * Prepare Data Source * * @param array $dataSource * @return array */ public function prepareDataSource(array $dataSource) { if (isset($dataSource['data']['items'])) { foreach ($dataSource['data']['items'] as & $item) { $item[$this->getData('name')] = [ 'edit' => [ 'href' => $this->urlBuilder->getUrl('helloworld/post/addnew', ['id' => $item['post_id']]), 'label' => __('Edit') ], 'delete' => [ 'href' => '/delete', 'label' => __('Delete') ], 'duplicate' => [ 'href' => '/duplicate', 'label' => __('Duplicate') ] ]; } } return $dataSource; } } |
Kết quả:
