I am trying to create a page which consist of the form and also the admin grid. Is it possible to do that. If so, can anybody provide documentation

2 Answers 2


Yes you can add your ui form and listing file in your layout in following way :

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
    <!-- <update handle="styles"/> -->
      <referenceContainer name="content">
        <uiComponent name="your_ui_form"/>
        <uiComponent name="your_ui_listing"/>

Attaching screenshot for reference : enter image description here

  • How can I use the values entered in the form to alter the values in listing grid? Commented Jun 29 at 5:45
  • Could you explain the full workflow and what you intend to achieve with the aforementioned form? Additionally, please provide examples of how it will affect the grid. Commented Jul 1 at 6:23
  • Like in the report dashboards, We can fill out the form and related values will be filled in the grid right. I want to achieve the same thing. Commented Jul 1 at 9:34

Yes, it's possible to create a page in Magento 2 that consists of both a form and an admin grid. You can do it using the below way.

  1. Create the Form: You can create a form UI component by defining it in a UI Component XML file. This file specifies the fields, fieldsets, and data sources for your form.

  2. Create the Admin Grid: Similarly, create an admin grid UI component by defining it in another UI Component XML file. This file will configure the grid's columns, data source, and other settings.

  • view/adminhtml/ui_component/my_form.xml
  • view/adminhtml/ui_component/my_grid.xml
  1. Link the Form and Grid to Your Layout: In your layout XML file, use the <uiComponent> node to include both the form and grid UI components on your page.
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <uiComponent name="my_form"/>
        <uiComponent name="my_grid"/>

This layout XML file tells Magento to render both UI components (my_form and my_grid) on the same page. Each UI component will be rendered according to its own XML configuration, which defines the grid or form structure, data source, columns, fields, etc.

Keep in mind that when including multiple UI components on the same page, you should ensure that their configurations do not conflict.

  • If you like the answer, please support by approving or upvoting the answer. Thanks! Commented Jun 29 at 8:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.