We use cookies to make your experience better. To comply with the new e-Privacy directive, we need to ask for your consent to set the cookies. Learn more.
Add a Mass Action in Admin Grid
Would you like to add a Mass Action item in an Admin grid? You can easily do that in Magento 2 by using an UI Component. Let's do it!
First of all Happy New Year once again to everyone!
This post is built around our free extension, Mass Email Customers, where a new Mass Action item is added to the existing customer's and sales order's grid.
For these two admin grids the corresponding UI component files are:
- Customer grid: \vendor\magento\module-customer\view\adminhtml\ui_component\customer_listing.xml
- Sales Order gird: \vendor\magento\module-sales\view\adminhtml\ui_component\sales_order_grid.xml
First of all for extending these two files, you have to create two new xml files in your module, which means under:
app/code/<Namespace>/<Modulename>/view/adminhtml/ui_component/
And for our example will be like:
app/code/MageVision/MassEmailCustomers/view/adminhtml/ui_component/customer_listing.xml
app/code/MageVision/MassEmailCustomers/view/adminhtml/ui_component/sales_order_grid.xml
To add an new Mass Action item to the customer grid, you can do it by adding the following code to the customer_listing.xml file. Code is valid for Magento 2.1 CE.
And in n Magento Admin the grid will look like:
To add an new Mass Action item to the sales order grid, you can do it by adding the following code to the sales_order_grid.xml file. Code is valid for Magento 2.1 CE.
And in n Magento Admin the grid will look like:
Let's explain a little bit the code we added in the xml files.
The top node of the listing component is the listingToolbar container with name listing_top.
Below we meet the child node massaction with name listing_massaction corresponding the massaction component.
The node action, is the new action item we added, with name mass_email_customer.
The node argument is an array declaration of the arguments will be passed to the action class Magento\Ui\Component\Action responsible for the node action.
The node item is also an array declaration of configuration for our new added item.
- type: which is about the action name
- label: which is about the text displayed in the massaction dropdown
- url: which is about the action URL
Additional configuration but not necessary for adding a new mass action item is the following configuration for a confirmation before the action.
- confirm: which is about adding a confirmation before the action, is also an array declaration
- title: which is about the title of the confirmation box
- message: which is about the text of the confirmation box
In this file vendor/magento/module-ui/view/base/ui_component/etc/definition.xml can be found the definitions of all the above components.
Feel free to share this post and ask your questions in the comments below.
Till next time!
Recent Posts
