This is my component field
<field name="is_campaign_plp" formElement="checkbox">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="component" xsi:type="string">Cpy_Cms/js/form/element/plp-campaign</item>
<item name="source" xsi:type="string">plp</item>
<item name="default" xsi:type="number">0</item>
</item>
</argument>
<settings>
<dataType>boolean</dataType>
<label translate="true">Used for Campaign only</label>
<dataScope>is_campaign_plp</dataScope>
</settings>
<formElements>
<checkbox>
<settings>
<valueMap>
<map name="false" xsi:type="number">0</map>
<map name="true" xsi:type="number">1</map>
</valueMap>
<prefer>toggle</prefer>
</settings>
</checkbox>
</formElements>
</field>
When I’m using <item name="component" xsi:type="string">Cpy_Cms/js/form/element/plp-campaign</item>
My checkbox systematically send the value 0 in the php form request.
var_dump($this->getRequest()->getParam(‘is_campaign_plp’)); //0 everytime
If I remove that js file…the data is properly sent.
var_dump($this->getRequest()->getParam(‘is_campaign_plp’)); //0 ou 1 depending on what i checked.
Inside my js…the value seems to be well recovered as the show hide is working fine.
define([
'jquery',
'underscore',
'uiRegistry',
'Magento_Catalog/js/form/element/checkbox'
], function ($, _, uiRegistry, checkbox) {
'use strict';
return checkbox.extend({
initialize: function() {
console.log("initialize");
var self = this;
self.inputName = 'is_campaign_plp';
$(document).ready(function(){
var interval = setInterval(function() {
if (jQuery('[name="is_campaign_plp"]').length > 0) {
self.onUpdate();
clearInterval(interval);
}
}, 200);
});
return this._super();
},
configureDataScope: function () {
var recordId,
value;
recordId = this.parentName.split('.').slice(-1)[0];
value = this.prefixElementName + recordId;
this.dataScope = 'data.' + this.inputCheckBoxName;
this.inputName = this.dataScopeToHtmlArray(this.inputCheckBoxName);
this.initialValue = value;
this.links.value = this.provider + ':' + this.dataScope;
},
/**
* On value change handler.
*
* @param {String} value
*/
onUpdate: function (value) {
console.log("update");
if(undefined === value) {
value = uiRegistry.get('index = is_campaign_plp').value();
}
console.log(value);
var categs = uiRegistry.get('index = categories'),
customerAccount = uiRegistry.get('index = customer_account'),
customerAccountUnderNav = uiRegistry.get('index = customer_account_under_nav');
if(value === '1') {
categs.hide();
customerAccount.hide();
customerAccountUnderNav.hide();
} else {
categs.show();
customerAccount.show();
customerAccountUnderNav.show();
}
console.log(value);
return this._super();
}
});
});