Questions tagged [uicomponent]

Denotes questions regarding Magento Ui Components

Filter by
Sorted by
Tagged with
87
votes
4answers
41k views

Explanation of UI Component Grid in Magento 2

Is there a good explaination and/or sample of the bare minimum configuration needed to create a UI Component Grid in Magento 2? I know there are myriad core components, such as ./vendor/magento/...
39
votes
0answers
1k views

Magento 2 Adminhtml spreading forms across multiple tabs

I'm attempting to create a backend module, wherein on my edit page I use admin-2column-left layout. I want to have a form on each tab, but I do not understand how I can do this. Ideally, I would ...
23
votes
2answers
1k views

Magento 2: what are the benefits of using UI grid components over the standard Grid.php?

So Magento 2 introduced the UI Components. One of them is the UI Component Grid (you can find more information about it here: Explanation of UI Component Grid in Magento 2) When creating a custom ...
22
votes
4answers
9k views

Display an image in the admin grid in magento 2

I want to display an image in the admin grid of one of my modules. I'm using the new grid system, the one with ui components. I took a look at how the thumbnail is added in the grid for products, but ...
18
votes
3answers
5k views

Add a note under a form field using ui components

How can I add a small text under a field in Magento 2 using ui components. Using Magento\Framework\Data\Form I could do this: /** @var \Magento\Framework\Data\Form $form */ $form = $this->...
18
votes
2answers
9k views

Magento 2 - How to add the DateTime UI Component

I want to add new field as datetime in CMS page section while adding new page, I found that magento using UI Component for it, so after digging I could able to add the date field by using below code ...
17
votes
2answers
10k views

Magento 2: Implement UI Fileuploader

I recently implemented the FileUploader Ui Component in my form on Magento 2.1.7. The code for it is here (app/code/Vendor/Blog/view/adminhtml/ui_component/vendor_blog_form.xml): <field name="...
16
votes
3answers
5k views

What are the “source” Items in UI Component Files

In Magento 2's UI Form Component configuration files, you'll often see a item attribute with the same of source -- <item name="source" xsi:type="string">block</item> below. #File: vendor/...
16
votes
1answer
2k views

Magento 2: What's the Difference Between the Two Grid Component Data Providers?

In Magento 2.1, there are 25 total UI Component listing/grid data providers configured and in use. Their data provider classes and ui_component files are listed below Magento\Bundle\Ui\DataProvider\...
15
votes
1answer
4k views

How to show custom block on shipping method select in Magento 2

Using reference link how to add custom block at shipping methods below in onepage checkout?, I am able to create additional shipping block on the bottom. But, I would like to show content only, when ...
15
votes
1answer
3k views

Magento 2: Why does a UI Listing Component need Two Collections?

Magento 2 has a new "uiComponent" feature. This allows to you to include a simple <uiComponent/> tag in your layout handle XML files to add things like Grids and forms to your application page. ...
14
votes
2answers
3k views

Magento Grid Component not Sorting Correctly

I've configured a grid component in Magento -- and the sorting behavior seems broken. Where can I debug this on the javascript level, and/or does anyone else have any idea why this might be happening?...
14
votes
2answers
10k views

Remove a UI component child via Layout XML

How do I remove a UI component child via Layout XML? For example, from the below xml directive in checkout_index_index.xml. How do I remove the shipping node ? <item name="sidebar" xsi:type="array"...
14
votes
2answers
4k views

How to change date format of magento 2 admin grid filter without using ui component?

Below is some_grid_block.xml , How can I change date format in calendar filter. <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:...
14
votes
2answers
3k views

Magento 2 Show timepicker using UiComponent not Datepicker

I want to show timepicker in my UiComponent form As Magento Docs show the variations they provide timepicker : I want this using UiComponent in my form. Note : Need to show schedule time so no ...
14
votes
1answer
581 views

Magento 2.1 Ui Component form field Token input

I want to add tags in an input field , in a similar fashion as it is done in product form to add catageories - which is show in the image below. This much task I have achieved by adding field ...
13
votes
6answers
12k views

How to remove Company field from checkout process in Magento 2?

How to remove Company field from checkout process in Magento 2? I've been looking for the template but have not found it. Update: Is there any way to remove this field via layout or template?
13
votes
2answers
2k views

Checkout Form - How to wrap multiple elements in a class - Magento 2

How do you wrap two checkout form elements inside a div? For example let's say I wanted to wrap these country and zip/postcode fields in a div with the class of example-class, how would I do this? ...
13
votes
5answers
2k views

Debugging ui components

I'm trying to build a CRUD module that uses UI components for admin grid and form. I've did this before and worked, but this one is a bit different and apparently I screwed something up. The problem ...
12
votes
2answers
6k views

Adding an image form element to an add/edit form

I'm building a CRUD module for Magento 2 using ui components for admin list and form and one of my entities has an image field. But I cannot make it work as it should. Here is how it should work. When ...
12
votes
1answer
1k views

Set default values for a multiselect ui-component

I have a custom entity in my magento 2 install. And one of the fields in this entity is of type multiselect and contains the list of all countries. I'm using the ui-components for my admin form. Since ...
12
votes
1answer
467 views

Magento 2 Show customer attribute in ui_component form

I've created ui_component form. Where I need to show customer details, Same as Customer Edit. But, I can able to show their data from customer_entity table. DataProvider.php public function ...
11
votes
2answers
3k views

What do “source” and “dataScope” mean in admin form Ui component configuraion file

There are source and dataScope nodes in Magento2 admin form UI component configuration. What do they mean and how are they supposed to be used? <field name="title"> <argument name="data" ...
11
votes
1answer
2k views

How to share Knockout JS observables between UI Components

I understand how to use imports: {} and exports: {} to share a UI components properties, such as: defaults: { exports: { shouldShowMessage: '${$.component}' } } Which returns the ...
11
votes
1answer
555 views

Magento 2.2: What is the definition.map.xml File?

Magento 2.2 introduced a new file, definition.map.xml. What is the purpose and intent of this file? It seems to be related to building the schemaMap property in Magento\Ui\Config\Converter, but none ...
10
votes
5answers
11k views

How to join order grid collection to custom table in Magento2?

I am trying to add a new column to order grid in Magento 2.0. So, i need to do joining to order grid collection. How can I achieve this ? Because, in magento2, the grid uses UI component.
10
votes
1answer
7k views

Magento 2 : How to add a product grid in custom module using ui component?

I have added product grid in Magento 2 admin form using this link: product grid. But now I am creating admin form using ui component and I am not able to change product grid using ui component. Please ...
10
votes
2answers
2k views

Magento 2.1.2 Ui- Component formElement select from multiple dropdowns

I have two drop downs one for Hours and one for Minutes.I have managed to display the drop down for hours But any one could assist - how do I display a drop-down for minutes,next to hours in th Ui ...
9
votes
7answers
11k views

Magento 2.1 How do I create form component field custom depends on another field value?

I have one field select which has some options. One of them will have some fields depend on value, another field will hidden. I have copied and extended component js for my field but it didn't work or ...
9
votes
2answers
33k views

Magento 2 get Parameters in the URL [duplicate]

I have created an admin form with phtml content and a ui component grid. Phtml section working fine. Now I want to filter the grid collection based on the url param. I have used the below code $this-&...
9
votes
1answer
6k views

How to make a form field readonly using ui-components?

I have this ui-component definition of a form field In my Magento 2 module. <field name="name"> <argument name="data" xsi:type="array"> <item name="config" ...
9
votes
2answers
11k views

How can I add a custom field to an admin form in Magento 2?

I've created a form in the admin using UI components, so in my view/adminhtml/ui_component/[module]_[entity]_form.xml I have the following: <field name="configuration"> <argument name="...
9
votes
1answer
1k views

Component vs Widget

In Magento 2 what is the difference between a component and a widget? For example there is a modal component and a modal widget, they both appear to do the same thing. Component The Modal UI ...
9
votes
1answer
963 views

Updating ui_bookmark Table When Adding Columns via ui_component XML

In Magento 2, the ui_component based grids allow you to reorder columns and Magento will remember your settings the next time you log in. This is accomplished by Magento saving data in the ...
9
votes
1answer
1k views

Set a default config value on a ui-component form field

The ui-components format for forms and grids is changing in version 2.2 (dev). (maybe it already did). How can I set a default value for a field. Before 2.2-dev you could add a field like this in the ...
9
votes
0answers
420 views

Magento 2 How to add Tab Component in admin module

How can I add UI Tab Component in custom admin module with the help of below user guide ? http://devdocs.magento.com/guides/v2.1/ui_comp_guide/components/ui-tab.html There are not enough information ...
9
votes
0answers
2k views

Magento2 : How to enable inline edit in catalog grid without changing source code?

I try to turn on inline edit in catalog grid as it described in DevDocs: http://devdocs.magento.com/guides/v2.0/ui-components/ui-secondary-inline.html Main problem is how to override this block of ...
8
votes
2answers
4k views

Magento 2 - custom admin grid field - error when sorting or filtering

I added custom column to admin grid, like this <column name="customer_name" class="Vendor\Module\Ui\Component\Listing\Columns\CustomerName"> <argument name="data" xsi:type="array">...
8
votes
2answers
3k views

UI component - display the time to 'Y-m-d H:i:s' format(ISO time format)

I create some admin listing pages by UI component, the default time format in their time column all like below The UI component codes like below <column name="created_at" class="Magento\Ui\...
8
votes
2answers
2k views

Magento 2: What's the `ui_component` folder for?

In addition to containing familiar folders like layout, and templates, a Magento 2 module's view folder also contains a ui_component sub-folder. view/adminhtml/ui_component What is this folder for? ...
8
votes
2answers
5k views

Magento2 Need to build Grid with multiple table collection using UI Components

Started on building custom module, it has feature to display the GRID view for which need to join multiple tables in collection and render them on GRID and filters. I have used UI Component from ...
8
votes
2answers
2k views

Magento 2 : How to Detect Checkout Step Change

I am trying to figure out the best method of detecting a step change in Magento 2's checkout. For example going from shipping details to payment, or vice versa. I have done some digging and in ...
8
votes
1answer
574 views

Reserved keyword in controller action - Magento 2

I am working on an admin grid concept. I found one github source code and analyzed that one. While I found the URL is different from the declaration in the UI component layout. <item name="url" ...
8
votes
1answer
2k views

adminhtml form ui_component fields not populated

I have created a form ui_component instance. The fields are rendered but not populated. Even though the rendered JSON contains the data, it does not display. What am I doing wrong? What are effective ...
8
votes
1answer
258 views

What is reverseMetadataMerge in UI Components?

When I look at the documentation of UI Components, I notice the following: <item name="reverseMetadataMerge" xsi:type="boolean">true</item> Now, most arguments are pretty self-explaining ...
8
votes
3answers
7k views

Magento 2 Product Edit/Add admin form custom section

I'm learning UI component. I want to add custom section in product edit/add backend form so for that I've created following files. vendor/module/view/adminhtml/ui_component/product_form.xml ...
8
votes
3answers
4k views

Magento 2: How do I hide a column from an admin grid?

Using 2.1.3, is there a way to hide an entire column from a UI component admin grid? I found Magento2 Add css class to admin ui grid column, and that hides the column, but not the column header (...
8
votes
1answer
4k views

Magento2 ui_component - form - image file input field

I'm currently trying to dig deeper into the UI Components but I'am kinda stuck here. Since it would be a little much to post all code here, I'll just post some relevant github links. What works is ...
8
votes
2answers
382 views

Where to place custom UI library

I need to create my own UI library (mostly .less files, but also images and .js) which will be used in multiple custom modules and themes. I thought I will just add my files to Magento UI library ...
8
votes
1answer
2k views

Magento 2: What Populates “elems” in a UI Component

The top level KnockoutJS template of listing UI Component looks like this <!-- File: vendor/magento//module-ui/view/base/web/templates/collection.html --> <each args="data: elems, as: '...