How to add Tab in Form Ui ComponentMagento 2.2.6 How to add TAB structure in admin UI component formData...
How did Alan Turing break the enigma code using the hint given by the lady in the bar?
Do Bugbears' arms literally get longer when it's their turn?
Finding algorithms of QGIS commands?
Why doesn't this Google Translate ad use the word "Translation" instead of "Translate"?
Why would a jet engine that runs at temps excess of 2000°C burn when it crashes?
Why would one plane in this picture not have gear down yet?
Is Gradient Descent central to every optimizer?
How do you like my writing?
Do I really need to have a scientific explanation for my premise?
Could a cubesat be propelled to the moon?
Do f-stop and exposure time perfectly cancel?
How does airport security verify that you can carry a battery bank over 100 Wh?
What Happens when Passenger Refuses to Fly Boeing 737 Max?
What is the chance of making a successful appeal to dismissal decision from a PhD program after failing the qualifying exam in the 2nd attempt?
In the late 1940’s to early 1950’s what technology was available that could melt a LOT of ice?
They call me Inspector Morse
PTIJ: Why can't I eat anything?
Solving "Resistance between two nodes on a grid" problem in Mathematica
Aliens englobed the Solar System: will we notice?
Why does the negative sign arise in this thermodynamic relation?
Time travel short story where dinosaur doesn't taste like chicken
Best approach to update all entries in a list that is paginated?
Peter's Strange Word
Unreachable code, but reachable with exception
How to add Tab in Form Ui Component
Magento 2.2.6 How to add TAB structure in admin UI component formData population in UI formuiComponent Form. How to show data from DB tableHow to add a link in ui form component note?Magento 2 : How can I upload files of dynamically added file input fields in the adminMagento 2 - insertListing ui componentMagento 2 Add new field to Magento_User admin formMagento 2 : how to add custom grid using ui-component in admin Form TabMagento 2 How to add Tab Component in admin moduleError depending with fileuploader on text field validation while saving category in BOMagento 2.2.6 How to add TAB structure in admin UI component form
6
I want to create the Tab in Edit Form by Ui Component. Can someone give me a direction to do that. Thanks.
This is the code work with ui component now:
I want the code work like below:
I spot that the Magento provide an tab component. But I don't know how to use it.
EDIT: Here my code:
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
magento2 uicomponent
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
add a comment |
6
I want to create the Tab in Edit Form by Ui Component. Can someone give me a direction to do that. Thanks.
This is the code work with ui component now:
I want the code work like below:
I spot that the Magento provide an tab component. But I don't know how to use it.
EDIT: Here my code:
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
magento2 uicomponent
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
add a comment |
6
6
6
3
I want to create the Tab in Edit Form by Ui Component. Can someone give me a direction to do that. Thanks.
This is the code work with ui component now:
I want the code work like below:
I spot that the Magento provide an tab component. But I don't know how to use it.
EDIT: Here my code:
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
magento2 uicomponent
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
I want to create the Tab in Edit Form by Ui Component. Can someone give me a direction to do that. Thanks.
This is the code work with ui component now:
I want the code work like below:
I spot that the Magento provide an tab component. But I don't know how to use it.
EDIT: Here my code:
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
magento2 uicomponent
magento2 uicomponent
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
edited Jan 9 '18 at 7:23
Nero Phung
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
asked Jan 6 '18 at 7:56
Nero PhungNero Phung
8941520
8941520
add a comment |
add a comment |
6 Answers
6
active
oldest
votes
4
Unfortunately, I don't think any of the other answers will work. One (the link to a tutorial) isn't even a UI Component. It is possible to add tabs with a UI Component. My example is for Magento 2.2 +, but I suspect it will work in earlier versions if adjusted for the old UI Component syntax.
Step #1
The following are the necessary requirements for making a UI Component with tabs work (replace all references to "referral" with your UI Component name):
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Referral</item>
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">referral_form.referral_form_data_source</item>
</item>
</argument>
<settings>
<layout>
<!-- I assume there are other options; set the layout handle accordingly -->
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
<deps>
<dep>referral_form.referral_form_data_source</dep>
</deps>
</settings>
<dataSource name="referral_form_data_source">
<!-- ... -->
</dataSource>
<fieldset name="referral_fieldset">
<settings>
<label translate="true">General Info</label>
</settings>
<!-- Each fieldset is a new tab -->
</fieldset>
</form>
Note: most of your example UI Component code is correct, but you need to add the following to the <settings> node:
<navContainerName>left</navContainerName>
<type>tabs</type>
Step #2
Set the layout on the page in the layout XML file: <page layout="admin-2columns-left"/>
Magento_Customer/view/base/ui_component/customer_form.xml is a good example in the core.
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
add a comment |
2
Replace below code in your roaming_form.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
You have to just add below line to make any tab collapsible.
<item name="collapsible" xsi:type="boolean">true</item>
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
add a comment |
1
Replace below code in your roaming_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<!--item name="template" xsi:type="string">templates/form/collapsible</item-->
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
<layout>
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
answered 8 mins ago
Abdul KadirAbdul Kadir
766
add a comment |
0
Add below code in your your_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
<fieldset name="list_product2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products2</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
</form>
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add<item name="is_collection" xsi:type="boolean">true</item>and<item name="source" xsi:type="string">new-tab</item> </item>with each fieldset and field. Still not working!
– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
|
show 3 more comments
0
It works once I updated both xxx_new.xml and xxx_edit.xml within layout folder. Otherwise it doesn't work at all.
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
add a comment |
-1
You can follow this tutorial
https://www.mage-world.com/blog/grid-and-form-in-magento-2-admin-panel-part-2.html
You can't create tab using the ui component you have to mention this as a layout ,you will get the detail in above link.
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "479"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f208308%2fhow-to-add-tab-in-form-ui-component%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
6 Answers
6
active
oldest
votes
6 Answers
6
active
oldest
votes
active
oldest
votes
active
oldest
votes
4
Unfortunately, I don't think any of the other answers will work. One (the link to a tutorial) isn't even a UI Component. It is possible to add tabs with a UI Component. My example is for Magento 2.2 +, but I suspect it will work in earlier versions if adjusted for the old UI Component syntax.
Step #1
The following are the necessary requirements for making a UI Component with tabs work (replace all references to "referral" with your UI Component name):
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Referral</item>
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">referral_form.referral_form_data_source</item>
</item>
</argument>
<settings>
<layout>
<!-- I assume there are other options; set the layout handle accordingly -->
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
<deps>
<dep>referral_form.referral_form_data_source</dep>
</deps>
</settings>
<dataSource name="referral_form_data_source">
<!-- ... -->
</dataSource>
<fieldset name="referral_fieldset">
<settings>
<label translate="true">General Info</label>
</settings>
<!-- Each fieldset is a new tab -->
</fieldset>
</form>
Note: most of your example UI Component code is correct, but you need to add the following to the <settings> node:
<navContainerName>left</navContainerName>
<type>tabs</type>
Step #2
Set the layout on the page in the layout XML file: <page layout="admin-2columns-left"/>
Magento_Customer/view/base/ui_component/customer_form.xml is a good example in the core.
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
add a comment |
4
Unfortunately, I don't think any of the other answers will work. One (the link to a tutorial) isn't even a UI Component. It is possible to add tabs with a UI Component. My example is for Magento 2.2 +, but I suspect it will work in earlier versions if adjusted for the old UI Component syntax.
Step #1
The following are the necessary requirements for making a UI Component with tabs work (replace all references to "referral" with your UI Component name):
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Referral</item>
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">referral_form.referral_form_data_source</item>
</item>
</argument>
<settings>
<layout>
<!-- I assume there are other options; set the layout handle accordingly -->
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
<deps>
<dep>referral_form.referral_form_data_source</dep>
</deps>
</settings>
<dataSource name="referral_form_data_source">
<!-- ... -->
</dataSource>
<fieldset name="referral_fieldset">
<settings>
<label translate="true">General Info</label>
</settings>
<!-- Each fieldset is a new tab -->
</fieldset>
</form>
Note: most of your example UI Component code is correct, but you need to add the following to the <settings> node:
<navContainerName>left</navContainerName>
<type>tabs</type>
Step #2
Set the layout on the page in the layout XML file: <page layout="admin-2columns-left"/>
Magento_Customer/view/base/ui_component/customer_form.xml is a good example in the core.
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
add a comment |
4
4
4
Unfortunately, I don't think any of the other answers will work. One (the link to a tutorial) isn't even a UI Component. It is possible to add tabs with a UI Component. My example is for Magento 2.2 +, but I suspect it will work in earlier versions if adjusted for the old UI Component syntax.
Step #1
The following are the necessary requirements for making a UI Component with tabs work (replace all references to "referral" with your UI Component name):
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Referral</item>
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">referral_form.referral_form_data_source</item>
</item>
</argument>
<settings>
<layout>
<!-- I assume there are other options; set the layout handle accordingly -->
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
<deps>
<dep>referral_form.referral_form_data_source</dep>
</deps>
</settings>
<dataSource name="referral_form_data_source">
<!-- ... -->
</dataSource>
<fieldset name="referral_fieldset">
<settings>
<label translate="true">General Info</label>
</settings>
<!-- Each fieldset is a new tab -->
</fieldset>
</form>
Note: most of your example UI Component code is correct, but you need to add the following to the <settings> node:
<navContainerName>left</navContainerName>
<type>tabs</type>
Step #2
Set the layout on the page in the layout XML file: <page layout="admin-2columns-left"/>
Magento_Customer/view/base/ui_component/customer_form.xml is a good example in the core.
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
Unfortunately, I don't think any of the other answers will work. One (the link to a tutorial) isn't even a UI Component. It is possible to add tabs with a UI Component. My example is for Magento 2.2 +, but I suspect it will work in earlier versions if adjusted for the old UI Component syntax.
Step #1
The following are the necessary requirements for making a UI Component with tabs work (replace all references to "referral" with your UI Component name):
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Referral</item>
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">referral_form.referral_form_data_source</item>
</item>
</argument>
<settings>
<layout>
<!-- I assume there are other options; set the layout handle accordingly -->
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
<deps>
<dep>referral_form.referral_form_data_source</dep>
</deps>
</settings>
<dataSource name="referral_form_data_source">
<!-- ... -->
</dataSource>
<fieldset name="referral_fieldset">
<settings>
<label translate="true">General Info</label>
</settings>
<!-- Each fieldset is a new tab -->
</fieldset>
</form>
Note: most of your example UI Component code is correct, but you need to add the following to the <settings> node:
<navContainerName>left</navContainerName>
<type>tabs</type>
Step #2
Set the layout on the page in the layout XML file: <page layout="admin-2columns-left"/>
Magento_Customer/view/base/ui_component/customer_form.xml is a good example in the core.
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
answered Oct 11 '18 at 1:31
bassplayer7bassplayer7
1,5781120
1,5781120
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
add a comment |
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
1
1
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
I am facing to create a new tab in form. I set the 2-column layout and added the <setting> tag and it's working fine. I can see the tab in left side but now form is not loaded. It's showing only loading spinner. I used the customer_form.xml for reference. Do have any idea about this?
– Gaurav Khatri
Dec 14 '18 at 9:10
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
@GauravKhatri I have the same issue. Did you found a solution
– Bram Gerritsen
Feb 20 at 15:00
add a comment |
2
Replace below code in your roaming_form.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
You have to just add below line to make any tab collapsible.
<item name="collapsible" xsi:type="boolean">true</item>
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
add a comment |
2
Replace below code in your roaming_form.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
You have to just add below line to make any tab collapsible.
<item name="collapsible" xsi:type="boolean">true</item>
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
add a comment |
2
2
2
Replace below code in your roaming_form.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
You have to just add below line to make any tab collapsible.
<item name="collapsible" xsi:type="boolean">true</item>
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
Replace below code in your roaming_form.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="collapsible" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
</form>
You have to just add below line to make any tab collapsible.
<item name="collapsible" xsi:type="boolean">true</item>
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
answered Apr 3 '18 at 10:32
Emipro Technologies Pvt. Ltd.Emipro Technologies Pvt. Ltd.
2,6011825
2,6011825
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
add a comment |
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
I try with your code but no luck.. magento.stackexchange.com/questions/249135/…
– Chirag Patel
Nov 12 '18 at 5:14
add a comment |
1
Replace below code in your roaming_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<!--item name="template" xsi:type="string">templates/form/collapsible</item-->
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
<layout>
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
answered 8 mins ago
Abdul KadirAbdul Kadir
766
add a comment |
1
Replace below code in your roaming_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<!--item name="template" xsi:type="string">templates/form/collapsible</item-->
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
<layout>
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
answered 8 mins ago
Abdul KadirAbdul Kadir
766
add a comment |
1
1
1
Replace below code in your roaming_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<!--item name="template" xsi:type="string">templates/form/collapsible</item-->
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
<layout>
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
answered 8 mins ago
Abdul KadirAbdul Kadir
766
Replace below code in your roaming_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<!--item name="template" xsi:type="string">templates/form/collapsible</item-->
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
<layout>
<navContainerName>left</navContainerName>
<type>tabs</type>
</layout>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
<item name="sortOrder" xsi:type="number">10</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
answered 8 mins ago
Abdul KadirAbdul Kadir
766
answered 8 mins ago
Abdul KadirAbdul Kadir
766
answered 8 mins ago
Abdul KadirAbdul Kadir
766
answered 8 mins ago
Abdul KadirAbdul Kadir
766
766
add a comment |
add a comment |
0
Add below code in your your_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
<fieldset name="list_product2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products2</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
</form>
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add<item name="is_collection" xsi:type="boolean">true</item>and<item name="source" xsi:type="string">new-tab</item> </item>with each fieldset and field. Still not working!
– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
|
show 3 more comments
0
Add below code in your your_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
<fieldset name="list_product2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products2</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
</form>
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add<item name="is_collection" xsi:type="boolean">true</item>and<item name="source" xsi:type="string">new-tab</item> </item>with each fieldset and field. Still not working!
– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
|
show 3 more comments
0
0
0
Add below code in your your_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
<fieldset name="list_product2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products2</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
</form>
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
Add below code in your your_form.xml file
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">roaming_form.roaming_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<settings>
<buttons>
<button name="delete" class="VendorModuleBlockAdminhtmlRoamingEditButtonsDelete"/>
<button name="save" class="VendorModuleBlockAdminhtmlRoamingEditButtonsSave"/>
<button name="back">
<url path="*/*/"/>
<class>back</class>
<label translate="true">Back</label>
</button>
</buttons>
<namespace>roaming_form</namespace>
<dataScope>data</dataScope>
<deps>
<dep>roaming_form.roaming_form_data_source</dep>
</deps>
</settings>
<dataSource name="roaming_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">VendorModuleUiDataProviderFormRoamingDataProvider</argument>
<argument name="name" xsi:type="string">roaming_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">entity_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
<settings>
<submitUrl path="mobifone/roaming/save"/>
</settings>
</dataSource>
<fieldset name="roaming_details">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Roaming Details</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<!--<field name="product_id">-->
<!--<argument name="data" xsi:type="array">-->
<!--<item name="config" xsi:type="array">-->
<!--<item name="label" xsi:type="string">Product ID</item>-->
<!--<item name="visible" xsi:type="boolean">true</item>-->
<!--<item name="dataType" xsi:type="string">text</item>-->
<!--<item name="formElement" xsi:type="string">input</item>-->
<!--<item name="source" xsi:type="string">current_roaming</item>-->
<!--</item>-->
<!--</argument>-->
<!--</field>-->
<field name="roaming_name">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string">Roaming Name</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
<field name="roaming_image">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="source" xsi:type="string">current_roaming</item>
<item name="label" xsi:type="string" translate="true">Roaming Image</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="dataScope" xsi:type="string">image</item>
<item name="required" xsi:type="boolean">false</item>
<item name="sortOrder" xsi:type="number">13</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="mobifone/roaming_image/upload"/>
</item>
</item>
</argument>
</field>
<field name="description">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
<item name="label" xsi:type="string">Description</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">wysiwyg</item>
<item name="template" xsi:type="string">ui/form/field</item>
<item name="wysiwyg" xsi:type="boolean">true</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
<fieldset name="list_product">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products</item>
</item>
</argument>
<insertListing name="products">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="source" xsi:type="string">products</item>
</item>
</argument>
<settings>
<externalData>id</externalData>
<externalProvider>${ $.ns }.product_listing_roaming</externalProvider>
<selectionsProvider>${ $.ns }.${ $.ns }.columns.ids</selectionsProvider>
<autoRender>true</autoRender>
<dataScope>product_listing_roaming</dataScope>
<ns>product_listing_roaming</ns>
</settings>
</insertListing>
</fieldset>
<fieldset name="list_product2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">List Products2</item>
</item>
</argument>
<field name="entity_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">false</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">current_roaming</item>
</item>
</argument>
</field>
</fieldset>
</form>
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
edited Jan 6 '18 at 9:07
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
answered Jan 6 '18 at 8:19
AbdulAbdul
8,15311136
8,15311136
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add<item name="is_collection" xsi:type="boolean">true</item>and<item name="source" xsi:type="string">new-tab</item> </item>with each fieldset and field. Still not working!
– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
|
show 3 more comments
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add<item name="is_collection" xsi:type="boolean">true</item>and<item name="source" xsi:type="string">new-tab</item> </item>with each fieldset and field. Still not working!
– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
Do I change any fieldset like this?
– Nero Phung
Jan 6 '18 at 8:34
I have add
<item name="is_collection" xsi:type="boolean">true</item> and <item name="source" xsi:type="string">new-tab</item> </item> with each fieldset and field. Still not working!– Nero Phung
Jan 6 '18 at 8:39
I have add
<item name="is_collection" xsi:type="boolean">true</item> and <item name="source" xsi:type="string">new-tab</item> </item> with each fieldset and field. Still not working!– Nero Phung
Jan 6 '18 at 8:39
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
can u please add you code in question
– Abdul
Jan 6 '18 at 8:54
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my code
– Nero Phung
Jan 6 '18 at 8:57
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
I have updated my ans pls check now and let me know any issue
– Abdul
Jan 6 '18 at 9:08
|
show 3 more comments
0
It works once I updated both xxx_new.xml and xxx_edit.xml within layout folder. Otherwise it doesn't work at all.
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
add a comment |
0
It works once I updated both xxx_new.xml and xxx_edit.xml within layout folder. Otherwise it doesn't work at all.
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
add a comment |
0
0
0
It works once I updated both xxx_new.xml and xxx_edit.xml within layout folder. Otherwise it doesn't work at all.
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
It works once I updated both xxx_new.xml and xxx_edit.xml within layout folder. Otherwise it doesn't work at all.
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
answered Jan 29 at 12:11
Lokesh DasLokesh Das
565
565
add a comment |
add a comment |
-1
You can follow this tutorial
https://www.mage-world.com/blog/grid-and-form-in-magento-2-admin-panel-part-2.html
You can't create tab using the ui component you have to mention this as a layout ,you will get the detail in above link.
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
add a comment |
-1
You can follow this tutorial
https://www.mage-world.com/blog/grid-and-form-in-magento-2-admin-panel-part-2.html
You can't create tab using the ui component you have to mention this as a layout ,you will get the detail in above link.
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
add a comment |
-1
-1
-1
You can follow this tutorial
https://www.mage-world.com/blog/grid-and-form-in-magento-2-admin-panel-part-2.html
You can't create tab using the ui component you have to mention this as a layout ,you will get the detail in above link.
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
You can follow this tutorial
https://www.mage-world.com/blog/grid-and-form-in-magento-2-admin-panel-part-2.html
You can't create tab using the ui component you have to mention this as a layout ,you will get the detail in above link.
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
answered Sep 15 '18 at 19:37
Mguru48Mguru48
412
412
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f208308%2fhow-to-add-tab-in-form-ui-component%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
