You need to sign in to do that
Don't have an account?
Lightning Channel message, default value in picklist
Hi Friends I am using the lightning Channel message in order to make two LWC talk one to another. The behaviour is very simple the first component has 3 picklists and the second component should display the ID of the selected item
I manage to make it work when the user change the picklist but I do not manage to make it work on the component are loaded and the default value is displayed
Another thing .. for some reason when I selected another picklist the ID value in the other disapear..
Could you please help me with those two issues ? please ?
Here is my code :
component 1 JS:
import { LightningElement,wire} from 'lwc'; import getRegion from '@salesforce/apex/PicklistHelper.getRegion'; import getCountry from '@salesforce/apex/PicklistHelper.getCountry'; import getMarket from '@salesforce/apex/PicklistHelper.getMarket'; import {publish, MessageContext} from 'lightning/messageService'; import RegionmessageChannel from '@salesforce/messageChannel/MarketMC__c'; export default class FilterPanel extends LightningElement { regionOptionsList; countryOptionsList; marketOptionsList; selectedCountry; selectedRegion; selectedMarket; @wire(MessageContext) messageContext; @wire(getRegion) retrieveRegion({error, data}){ let tempArray = [] let tempDefaultValueList = [] if(data){ for(let key in data){ tempArray.push({label:data[key], value:key}); tempDefaultValueList.push(key); } } this.regionOptionsList = tempArray; this.selectedRegion = tempDefaultValueList[0]; } sendToother(){ const payload = { regionID: tempDefaultValueList[0]}; publish(this.messageContext, RegionmessageChannel, payload); } handleRegionChange(event){ this.selectedRegion = event.target.value; const payload = { regionID: this.selectedRegion}; publish(this.messageContext, RegionmessageChannel, payload); } @wire(getCountry, {RegionId: '$selectedRegion'}) retrieveCountry({error, data}){ let CountrytempArray = [] let countryTempDefaultList = [] if(data){ for(let key in data){ CountrytempArray.push({label:data[key], value:key}); countryTempDefaultList.push(key); } } this.countryOptionsList = CountrytempArray; this.selectedCountry = countryTempDefaultList[0] } handleCountryChange(event){ this.selectedCountry = event.target.value; const payload = { countryID: this.selectedCountry}; publish(this.messageContext, RegionmessageChannel, payload); } @wire(getMarket, {CountryId: '$selectedCountry'}) retrieveMarket({error, data}){ let MarketempArray = [] let marketTempDefaultList = [] if(data){ for(let key in data){ MarketempArray.push({label:data[key], value:key}); marketTempDefaultList.push(key); } } this.marketOptionsList = MarketempArray; this.selectedMarket = marketTempDefaultList[0] } handleMarketChange(event){ this.selectedMarket = event.target.value; const payload = { marketID: this.selectedMarket}; publish(this.messageContext, RegionmessageChannel, payload); } }
Component 2 JS:
import { LightningElement, api, wire } from 'lwc'; import { subscribe, MessageContext, APPLICATION_SCOPE } from 'lightning/messageService'; import RegionmessageChannel from '@salesforce/messageChannel/MarketMC__c'; export default class InlineDataTablePropertyQualification extends LightningElement { SelectedRegionID; SelectedCountryID; SelectedMarketID; subscription = null; @wire(MessageContext) messageContext; subscribeToMessageChannel() { if (!this.subscription) { this.subscription = subscribe( this.messageContext, RegionmessageChannel, (message) => this.handleMessage(message), { scope: APPLICATION_SCOPE } ); } } handleMessage(message) { this.SelectedRegionID = message.regionID; this.SelectedCountryID = message.countryID; this.SelectedMarketID = message.marketID; } connectedCallback() { this.subscribeToMessageChannel(); } }my XML:
<?xml version="1.0" encoding="UTF-8"?> <LightningMessageChannel xmlns="http://soap.sforce.com/2006/04/metadata"> <description>This chanel get the makrket ID selected in the Project management filter component</description> <isExposed>true</isExposed> <lightningMessageFields> <description>Gewt the region ID</description> <fieldName>regionID</fieldName> </lightningMessageFields> <lightningMessageFields> <description>Get the country ID</description> <fieldName>countryID</fieldName> </lightningMessageFields> <lightningMessageFields> <description>Get the market ID</description> <fieldName>marketID</fieldName> </lightningMessageFields> <masterLabel>Market ID from filter component</masterLabel> </LightningMessageChannel>