You need to sign in to do that
Don't have an account?
Akhila Lakshmi Sravani Kona
GET THE PICKLIST OPTIONS FROM JS METHOD TO LWC HTML
import { LightningElement, wire, track } from 'lwc';
import performCallout from '@salesforce/apex/insuranceReadyTest2.performCallout';
import stateperformCallout from '@salesforce/apex/getState.stateperformCallout';
import cityperformCallout from '@salesforce/apex/getCities.cityperformCallout';
export default class InsuranceReady extends LightningElement {
@wire(performCallout) countries;
@track selectedCountryIso2;
@track selectedStateIso2;
@track error;
@wire(stateperformCallout, { country: '$selectedCountryIso2' })
wiredstateperformCallout({ error, data }) {
if (data) {
this.states = data;
this.error = undefined;
console.log("States :",JSON.stringify(data));
} else if (error) {
this.error = error;
this.states = undefined;
console.error("Error :",error);
}
}
@wire(cityperformCallout, { country: '$selectedCountryIso2',state:'$selectedStateIso2' })
wiredcityperformCallout({ error, data }) {
if (data) {
this.cities = data;
this.error = undefined;
console.log("Cities :",JSON.stringify(data));
} else if (error) {
this.error = error;
this.states = undefined;
console.error("Error :",error);
}
}
@track selectedState = '';
@track selectedCity='';
handleCountryChange(event) {
const selectedCountry = event.target.value;
this.selectedCountryIso2 = event.detail.value;
console.log("Country ISO2 :",this.selectedCountryIso2);
}
handleStateChange(event) {
this.selectedState = event.detail.value;
this.selectedStateIso2 = event.detail.value;
console.log("State ISO2 :",this.selectedStateIso2);
}
handleCityChange(event) {
const selectedCity = event.target.value;
}
get countryOptions() {
if (this.countries.data) {
return this.countries.data.map(country => {
return { label: country.name, value: country.iso2 };
});
}
}
get stateOptions() {
console.log(this.states);
if (this.states) {
return this.states.map(state => {
return { value: state.name, label: state.iso2 };
});
}
}
get cityOptions() {
if (this.cities) {
return this.cities.map(city => {
return { label: city.name, value: city.name };
});
}
}
connectedCallback() {
if (!this.states) {
console.log('No states data returned');
} else {
console.log("States :",JSON.stringify(this.states));
}
}
}
HTML CODE:
<template>
<div>
<template if:true={countries.data}>
<lightning-combobox options={countryOptions} value={selectedCountryIso2} onchange={handleCountryChange}>
</lightning-combobox>
</template>
<template if:true={selectedCountryIso2}>
<lightning-combobox
name="stateSelect"
label="Select a State"
options={stateOptions}
value={selectedStateIso2}
onchange={handleStateChange}>
</lightning-combobox>
</template>
<template if:true={selectedCountryIso2}>
<template if:true={selectedStateIso2}>
<lightning-combobox
name="citySelect"
label="Select a City"
value={selectedCity}
options={cityOptions}>
</lightning-combobox>
</template>
</template>
</div>
</template>
import performCallout from '@salesforce/apex/insuranceReadyTest2.performCallout';
import stateperformCallout from '@salesforce/apex/getState.stateperformCallout';
import cityperformCallout from '@salesforce/apex/getCities.cityperformCallout';
export default class InsuranceReady extends LightningElement {
@wire(performCallout) countries;
@track selectedCountryIso2;
@track selectedStateIso2;
@track error;
@wire(stateperformCallout, { country: '$selectedCountryIso2' })
wiredstateperformCallout({ error, data }) {
if (data) {
this.states = data;
this.error = undefined;
console.log("States :",JSON.stringify(data));
} else if (error) {
this.error = error;
this.states = undefined;
console.error("Error :",error);
}
}
@wire(cityperformCallout, { country: '$selectedCountryIso2',state:'$selectedStateIso2' })
wiredcityperformCallout({ error, data }) {
if (data) {
this.cities = data;
this.error = undefined;
console.log("Cities :",JSON.stringify(data));
} else if (error) {
this.error = error;
this.states = undefined;
console.error("Error :",error);
}
}
@track selectedState = '';
@track selectedCity='';
handleCountryChange(event) {
const selectedCountry = event.target.value;
this.selectedCountryIso2 = event.detail.value;
console.log("Country ISO2 :",this.selectedCountryIso2);
}
handleStateChange(event) {
this.selectedState = event.detail.value;
this.selectedStateIso2 = event.detail.value;
console.log("State ISO2 :",this.selectedStateIso2);
}
handleCityChange(event) {
const selectedCity = event.target.value;
}
get countryOptions() {
if (this.countries.data) {
return this.countries.data.map(country => {
return { label: country.name, value: country.iso2 };
});
}
}
get stateOptions() {
console.log(this.states);
if (this.states) {
return this.states.map(state => {
return { value: state.name, label: state.iso2 };
});
}
}
get cityOptions() {
if (this.cities) {
return this.cities.map(city => {
return { label: city.name, value: city.name };
});
}
}
connectedCallback() {
if (!this.states) {
console.log('No states data returned');
} else {
console.log("States :",JSON.stringify(this.states));
}
}
}
HTML CODE:
<template>
<div>
<template if:true={countries.data}>
<lightning-combobox options={countryOptions} value={selectedCountryIso2} onchange={handleCountryChange}>
</lightning-combobox>
</template>
<template if:true={selectedCountryIso2}>
<lightning-combobox
name="stateSelect"
label="Select a State"
options={stateOptions}
value={selectedStateIso2}
onchange={handleStateChange}>
</lightning-combobox>
</template>
<template if:true={selectedCountryIso2}>
<template if:true={selectedStateIso2}>
<lightning-combobox
name="citySelect"
label="Select a City"
value={selectedCity}
options={cityOptions}>
</lightning-combobox>
</template>
</template>
</div>
</template>
Refer the below link and modify your code.
https://www.salesforcecodecrack.com/2019/03/how-to-fetch-picklist-values-in.html
Thanks!!
<template if:true={StatusOptions}>
<lightning-combobox class="" name="Status"
label="Status" required="true" variant="label-hidden" value={selectedStatus}
placeholder="Status" options={StatusOptions.values} onchange={handleStatusChange} >
</lightning-combobox>
</template>
<!-- HTML --->
<!-- JS Code --->
import { LightningElement ,track ,wire , api } from 'lwc';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import CONTACT_OBJECT from '@salesforce/schema/Contact';
import STATUS from '@salesforce/schema/Contact.Status';
export default class getContactStatus extends LightningElement
{
@api recordId;
@api objectApiName;
@wire (getObjectInfo, {objectApiName: CONTACT_OBJECT}) contactObject;
@track StatusOptions = [] ;
@track selectedStatus ;
@wire (getPicklistValues, {recordTypeId: '$contactObject.data.defaultRecordTypeId', fieldApiName: STATUS}) wiredStatus({ error, data }) {
this.isLoading = true ;
this.StatusOptions = undefined;
if (data) {
//console.log('Value is ' + data);
this.StatusOptions = data;
this.isLoading = false ;
} else if (error) {
this.isLoading = false ;
}
}
handleStatusChange(event){
this.selectedStatus = event.target.value;
}
}