For Ui Component admin form Field with ajax updating the select value The Next CEO of Stack OverflowMagento 2 form ui component ajax fieldsetMagento 2.1 How do I create form component field custom depends on another field value?Magento 2 Admin Form FieldCan't set value for wysiwyg field component in admin formHow to add multi-select field in magento2 ui formIn Magento2 For Ui component Form select Field,Dependency with another FieldMulti Select UI Field in user form magento2Get text field value Ui ComponentHow to hide particular admin form field(UI Component) based on the value of select field?Change the width of Field Ui Component Magento 2

Text adventure game code

What is the purpose of the Evocation wizard's Potent Cantrip feature?

Why doesn't a table tennis ball float on the surface? How do we calculate buoyancy here?

How did people program for Consoles with multiple CPUs?

Does the Brexit deal have to be agreed by both Houses?

How to start emacs in "nothing" mode (`fundamental-mode`)

Is it okay to store user locations?

Need some help with wall behind rangetop

Return the Closest Prime Number

Why didn't Khan get resurrected in the Genesis Explosion?

How can I quit an app using Terminal?

Unreliable Magic - Is it worth it?

How to write the block matrix in LaTex?

The King's new dress

Why here is plural "We went to the movies last night."

What's the point of interval inversion?

Customer Requests (Sometimes) Drive Me Bonkers!

Why do remote companies require working in the US?

Natural language into sentence logic

Implement the Thanos sorting algorithm

Why didn't Theresa May consult with Parliament before negotiating a deal with the EU?

Which organization defines CJK Unified Ideographs?

How long to clear the 'suck zone' of a turbofan after start is initiated?

How can I get through very long and very dry, but also very useful technical documents when learning a new tool?



For Ui Component admin form Field with ajax updating the select value



The Next CEO of Stack OverflowMagento 2 form ui component ajax fieldsetMagento 2.1 How do I create form component field custom depends on another field value?Magento 2 Admin Form FieldCan't set value for wysiwyg field component in admin formHow to add multi-select field in magento2 ui formIn Magento2 For Ui component Form select Field,Dependency with another FieldMulti Select UI Field in user form magento2Get text field value Ui ComponentHow to hide particular admin form field(UI Component) based on the value of select field?Change the width of Field Ui Component Magento 2










4















I have a select field in the UI component, on the changing the select field with ajax how to load the next select field.in the admin side?










share|improve this question




























    4















    I have a select field in the UI component, on the changing the select field with ajax how to load the next select field.in the admin side?










    share|improve this question


























      4












      4








      4








      I have a select field in the UI component, on the changing the select field with ajax how to load the next select field.in the admin side?










      share|improve this question
















      I have a select field in the UI component, on the changing the select field with ajax how to load the next select field.in the admin side?







      magento2 ajax uicomponent






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited 33 mins ago









      Teja Bhagavan Kollepara

      3,01241949




      3,01241949










      asked Jan 5 '18 at 12:25









      shivashankar mshivashankar m

      1,333828




      1,333828




















          1 Answer
          1






          active

          oldest

          votes


















          2














          Please follow below steps.



          Step-1: create select box element like below code in your ui_component form xml



           <field name="select_box_1">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="component" xsi:type="string">Namespace_Module/js/form/element/select-option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_1</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>

          <field name="select_box_2">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxTwoOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_2</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>


          Step-2: create select-option.js in Namespace/Module/view/adminhtml/web/js/form/element and paste below code in file:



          define([
          'jquery',
          'underscore',
          'uiRegistry',
          'Magento_Ui/js/form/element/select',
          'Magento_Ui/js/modal/modal',
          ], function ($, _, uiRegistry, select, modal)
          'use strict';
          return select.extend(

          /**
          * On value change handler.
          *
          * @param String value
          */
          onUpdate: function (value)

          if (value != 'undefined')

          //Do your Ajx stuff here

          return this._super();
          ,
          );
          );





          share|improve this answer























          • Have you idea about how to get value on page load?

            – Dhaduk Mitesh
            Oct 9 '18 at 5:10











          • That you get from Dataprovider class

            – Nilesh Gosai
            Oct 9 '18 at 9:14











          • Can you please give me hint in comment? How to use Dataprovider?

            – Dhaduk Mitesh
            Oct 9 '18 at 9:20











          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


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f208249%2ffor-ui-component-admin-form-field-with-ajax-updating-the-select-value%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown

























          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          2














          Please follow below steps.



          Step-1: create select box element like below code in your ui_component form xml



           <field name="select_box_1">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="component" xsi:type="string">Namespace_Module/js/form/element/select-option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_1</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>

          <field name="select_box_2">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxTwoOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_2</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>


          Step-2: create select-option.js in Namespace/Module/view/adminhtml/web/js/form/element and paste below code in file:



          define([
          'jquery',
          'underscore',
          'uiRegistry',
          'Magento_Ui/js/form/element/select',
          'Magento_Ui/js/modal/modal',
          ], function ($, _, uiRegistry, select, modal)
          'use strict';
          return select.extend(

          /**
          * On value change handler.
          *
          * @param String value
          */
          onUpdate: function (value)

          if (value != 'undefined')

          //Do your Ajx stuff here

          return this._super();
          ,
          );
          );





          share|improve this answer























          • Have you idea about how to get value on page load?

            – Dhaduk Mitesh
            Oct 9 '18 at 5:10











          • That you get from Dataprovider class

            – Nilesh Gosai
            Oct 9 '18 at 9:14











          • Can you please give me hint in comment? How to use Dataprovider?

            – Dhaduk Mitesh
            Oct 9 '18 at 9:20















          2














          Please follow below steps.



          Step-1: create select box element like below code in your ui_component form xml



           <field name="select_box_1">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="component" xsi:type="string">Namespace_Module/js/form/element/select-option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_1</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>

          <field name="select_box_2">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxTwoOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_2</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>


          Step-2: create select-option.js in Namespace/Module/view/adminhtml/web/js/form/element and paste below code in file:



          define([
          'jquery',
          'underscore',
          'uiRegistry',
          'Magento_Ui/js/form/element/select',
          'Magento_Ui/js/modal/modal',
          ], function ($, _, uiRegistry, select, modal)
          'use strict';
          return select.extend(

          /**
          * On value change handler.
          *
          * @param String value
          */
          onUpdate: function (value)

          if (value != 'undefined')

          //Do your Ajx stuff here

          return this._super();
          ,
          );
          );





          share|improve this answer























          • Have you idea about how to get value on page load?

            – Dhaduk Mitesh
            Oct 9 '18 at 5:10











          • That you get from Dataprovider class

            – Nilesh Gosai
            Oct 9 '18 at 9:14











          • Can you please give me hint in comment? How to use Dataprovider?

            – Dhaduk Mitesh
            Oct 9 '18 at 9:20













          2












          2








          2







          Please follow below steps.



          Step-1: create select box element like below code in your ui_component form xml



           <field name="select_box_1">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="component" xsi:type="string">Namespace_Module/js/form/element/select-option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_1</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>

          <field name="select_box_2">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxTwoOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_2</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>


          Step-2: create select-option.js in Namespace/Module/view/adminhtml/web/js/form/element and paste below code in file:



          define([
          'jquery',
          'underscore',
          'uiRegistry',
          'Magento_Ui/js/form/element/select',
          'Magento_Ui/js/modal/modal',
          ], function ($, _, uiRegistry, select, modal)
          'use strict';
          return select.extend(

          /**
          * On value change handler.
          *
          * @param String value
          */
          onUpdate: function (value)

          if (value != 'undefined')

          //Do your Ajx stuff here

          return this._super();
          ,
          );
          );





          share|improve this answer













          Please follow below steps.



          Step-1: create select box element like below code in your ui_component form xml



           <field name="select_box_1">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="component" xsi:type="string">Namespace_Module/js/form/element/select-option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_1</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>

          <field name="select_box_2">
          <argument name="data" xsi:type="array">
          <item name="options" xsi:type="object">NamespaceModuleModelConfigSourceSelectBoxTwoOption</item>
          <item name="config" xsi:type="array">
          <item name="dataType" xsi:type="string">text</item>
          <item name="label" xsi:type="string" translate="true">Select Option</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="source" xsi:type="string">modulename</item>
          <item name="dataScope" xsi:type="string">select_box_2</item>
          <item name="validation" xsi:type="array">
          <item name="required-entry" xsi:type="boolean">true</item>
          </item>
          </item>
          </argument>
          </field>


          Step-2: create select-option.js in Namespace/Module/view/adminhtml/web/js/form/element and paste below code in file:



          define([
          'jquery',
          'underscore',
          'uiRegistry',
          'Magento_Ui/js/form/element/select',
          'Magento_Ui/js/modal/modal',
          ], function ($, _, uiRegistry, select, modal)
          'use strict';
          return select.extend(

          /**
          * On value change handler.
          *
          * @param String value
          */
          onUpdate: function (value)

          if (value != 'undefined')

          //Do your Ajx stuff here

          return this._super();
          ,
          );
          );






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Jan 25 '18 at 7:08









          Nilesh GosaiNilesh Gosai

          639410




          639410












          • Have you idea about how to get value on page load?

            – Dhaduk Mitesh
            Oct 9 '18 at 5:10











          • That you get from Dataprovider class

            – Nilesh Gosai
            Oct 9 '18 at 9:14











          • Can you please give me hint in comment? How to use Dataprovider?

            – Dhaduk Mitesh
            Oct 9 '18 at 9:20

















          • Have you idea about how to get value on page load?

            – Dhaduk Mitesh
            Oct 9 '18 at 5:10











          • That you get from Dataprovider class

            – Nilesh Gosai
            Oct 9 '18 at 9:14











          • Can you please give me hint in comment? How to use Dataprovider?

            – Dhaduk Mitesh
            Oct 9 '18 at 9:20
















          Have you idea about how to get value on page load?

          – Dhaduk Mitesh
          Oct 9 '18 at 5:10





          Have you idea about how to get value on page load?

          – Dhaduk Mitesh
          Oct 9 '18 at 5:10













          That you get from Dataprovider class

          – Nilesh Gosai
          Oct 9 '18 at 9:14





          That you get from Dataprovider class

          – Nilesh Gosai
          Oct 9 '18 at 9:14













          Can you please give me hint in comment? How to use Dataprovider?

          – Dhaduk Mitesh
          Oct 9 '18 at 9:20





          Can you please give me hint in comment? How to use Dataprovider?

          – Dhaduk Mitesh
          Oct 9 '18 at 9:20

















          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














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f208249%2ffor-ui-component-admin-form-field-with-ajax-updating-the-select-value%23new-answer', 'question_page');

          );

          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







          Popular posts from this blog

          Nidaros erkebispedøme

          Birsay

          Was Woodrow Wilson really a Liberal?Was World War I a war of liberals against authoritarians?Founding Fathers...