I've written a custom module which adds a new tab to admin category edit page, using UI component form ([Vendor] \
[Module]\view\adminhtml\ui_component\category_form.xml).
Everything works fine from textbox, text area to date field and even "insertListing".
But I have to add button as a field. When I took a look at
vendor/magento/module-ui/etc/ui_definition.xsd
I could see <xs:element type="button" name="button"/>
as a formElement type.
But there are no reference in the core on how to use this button as a formElement in a UI component form.
Can someone throw some light on this?
Thanks.
Best Answer
Okay I figured out a way to use a button element as a category attribute. What I've done is used the
ElementTmpl
property to render a category attribute as a Media browser.Let's get into the code:
The result is I see a button on category edit page:
when I click the button, there is a pop-up with Media Browser
The target input box's id was passed from
category_form.xml
to thecustom-button.html
, so the encoded url of the image selected in the media browser will get populated in the hidden input box that was put before the button in the html file.Now when this category is saved, the encoded url have to be decoded and saved in the DB (I'll skip that code), so when we load the page again the preview of the image will be available.