How to get value from Ui-select in js magento2 at page load

Question

I have created field in phtml and want to get values from multi-select dropdown inside js.

Inside phtml

 <form id="attr-form" action="<?php echo $block->getUrl('*/*/save') ?>" enctype="multipart/form-data" method="post" data-mage-init='{"validation":{}}'>
 <div id="printmessage" class="alert alert-success"></div> 
 <fieldset class="fieldset">
 <div class="field required">
 <label class="label"><?php echo __('Label') ?>:</label>
 <div data-bind="scope: 'customLabel'">
 <!-- ko template: getTemplate() --><!-- /ko -->
 </div>
 <script type="text/x-magento-init">
 {
 "*": {
 "Magento_Ui/js/core/app": {
 "components": {
 "customLabel": {
 "component": "MyModule_Module/js/ui-select",
 "template" : "MyModule_Module/ui-select",
 "filterOptions": true,
 "levelsVisibility": "1",
 "multiple": true,
 "showCheckbox": true,
 "options": <?php echo $block->getCollectionTree()?>
 }
 }
 }

Inside js/ui-select.js

define([
 'Magento_Ui/js/form/element/ui-select',
 'jquery'
], function (Select, $) {
 'use strict';
 return Select.extend({
});
});

If i call initialize inside Select.extend({ }), multiselect dropdown throws error. How to get selected value when i press save button in toolbar.And how to preselect options on page load?

Answer 1

try this

define([
 'jquery',
 'underscore',
 'uiRegistry',
 'Magento_Ui/js/form/element/select'
], function (,ドル _, uiRegistry, select) {
 'use strict';
 return select.extend({
 initialize: function (){
 var status = this._super().initialValue;
 console.log("On Load");
 return this;
 },
 /**
 * On value change handler.
 *
 * @param {String} value
 */
 onUpdate: function (value) {
 //return this._super();
 console.log("Update");
 },
 });
});

• user90874: its working!! ..