Skip to content

Instantly share code, notes, and snippets.

@navarr
Last active December 2, 2016 17:12
Show Gist options
  • Save navarr/b3988e21423df74a86491b4f8970cdeb to your computer and use it in GitHub Desktop.
Save navarr/b3988e21423df74a86491b4f8970cdeb to your computer and use it in GitHub Desktop.

Usage:

  • Add the mixin somewhere
  • Duplicate the mixin instructions into your require-js
  • Form XML:
  <form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
      <!-- ... -->
      <field ...>
        <item name="config" xsi:type="array">
          <!-- ... -->
          <item name="fieldDependency" xsi:type="string">${ $.provider}:${ $.parentScope }.FIELD_TO_DEPEND_ON</item>
        </item>
      </field>
    </form>

Where FIELD_TO_DEPEND_ON is the name (in the current scope) of the field you want this to only be visible if it has a truthy value.

define([], function() {
'use strict';
return function(targetModule) {
return targetModule.extend({
initialize: function() {
this._super();
if (this.fieldDependency) {
this.initFieldDependency();
}
},
initFieldDependency: function() {
// Initial setting
var dependency = this.fieldDependency;
this._changeDependencyValue(this.default);
//
this.setLinks({
'_changeDependencyValue': dependency
}, 'imports');
},
_changeDependencyValue: function (value) {
var show = !!value;
this.visible(show);
}
})
}
});
var config = {
'config': {
'mixins': {
'Magento_Ui/js/form/element/abstract': {
'Briteskies_Organizations/field-dependency': true
}
}
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment