How to Create Custom Admin Grid

Blog
Spread the love

In this blog we will learn how to create custom admin grid. Magento 2 grids are a way to list the items in a database table for better management. Grid allows us to sort, filter, edit and update data.

Before you begin: You should have a custom module, in that you need to create menu and other related files and folders.

If you want to create custom menu click here.

To register a frontend route, we must create a routes.xml file:

Step 1: Create routes.xml

app/code/Bluethink/CustomMenu/etc/adminhtml/routes.xml

The id attribute is a unique string which will identify this route.

The frontName attribute is also a unique string which will be shown on the url request.

Step 2: Create controller

app/code/Bluethink/CustomMenu/Controller/Adminhtml/Post/Index.php

All controllers have to contain a public execute method. It is called when accessing the controller. The storefront controllers are inherited from the \Magento\Framework\App\Action\Action class.

After create controller we will create layout file.

Step 3: Create menu_post_index.xml

app/code/Bluethink/CustomMenu/view/adminhtml/layout/menu_post_index.xml

The layout file is an XML file which will define the page structure.

In this layout file, we declare an uiComponent for the content of this page. Basically with uiComponent, Magento allows us to create nice user interface for lists, forms etc. we need to create ui_component folder inside view/adminhtml folder.

Step 4: Create quote_listing.xml

app/code/Bluethink/CustomMenu/view/adminhtml/ui_component/quote_listing.xml

In the ui_component folder, we will finally create the UI Grid and display customer data.

Step 5: Create di.xml

app/code/Bluethink/CustomMenu/etc/di.xml

Declare resource in dependency injection file. Now we will create di.xml file which will connect to the Model to get the data for our grid.

The type is used for changing arguments of class or to pass new arguments to that class. Whereas virtualType is used to create a virtual sub-class (means we don’t have to create the .php file).

Step 6: Create UpgradeSchema.php

app/code/Bluethink/CustomMenu/Setup/UpgradeSchema.php

In this blog we use magento quote table, we need to index table for perform full text search in admin grid.

Step 7: Run command

php bin/magento setup:upgrade

php bin/magento setup:di:compile

php bin/magento cache:flush

Magento 2

You can download sample module for admin menu here.

bluethinkinc_blog

bluethinkinc_blog

2022-09-01

0

Leave a Reply

Your email address will not be published. Required fields are marked *

Find More Blogs

Building a REST API with Spring Boot

Spread the love Introduction REST (Representational State

Custom API to Fetch Customer Data by Customer ID in Spryker

Spread the love Introduction In this blog post, we will

Creating a Custom Module for a Custom Frontend Page in Spryker

Spread the love To create a custom module for a custom

How to create custom module api get category list without access token in Spryker

Spread the love To create a custom API for fetching a

Creating a Custom Glue API in Spryker

Spread the love Spryker’s Glue API is a powerful tool

Get AI Generated 360-Degree View of Account Summary in Dynamics 365 Sales

Spread the love Navigating the demanding landscape of sales

Enhancing Productivity with Dynamics 365: The Power of Session Restore

Spread the love Enhancing Productivity with Dynamics 365:

Salesforce Admin

Spread the love In our last blog, we discussed common

Unlocking AI with Spring Boot: Real-World Use Cases and Solutions

Spread the love Artificial Intelligence (AI) has moved from

Enhancing Performance with Reactive Java: A Beginner-Friendly Guide

Spread the love In today’s fast-paced software

bluethinkinc Blogs