Salesforce Asked by Ajinkyasd on January 6, 2021
I have custom table with the multiple rows and there are two picklists in each row. Picklist options are as follows:
@track picklist1 = [
{value: 'w1', label: 'w1'},
{value: 'w2', label: 'w2'}
];
@track picklist2 = [
{value: 'v1', label: 'v1'},
{value: 'v2', label: 'v2'},
{value: 'v3', label: 'v3'}
];
This should work for each row, i.e if 1st row picklist1 value is edited, then only 1st row picklist2 values should be updated and displayed.
html:
<td>
<div>
<div class="slds-select_container">
<select class="slds-select" data-item={some id} onchange={handlePicklist1Change}>
<option value="">Select</option>
<template for:each ={picklist1} for:item="item">
<option key={item.key} value={item.key}>{item.value}</option>
</template>
</select>
</div>
</div>
</td>
<td>
<div>
<div class="slds-select_container">
<select class="slds-select" data-item={some id} onchange={handlePicklist2Change}>
<option value="">Select</option>
<template for:each ={picklist2} for:item="item">
<option key={item.key} value={item.key}>{item.value}</option>
</template>
</select>
</div>
</div>
</td>
Js:
handlePicklist1Change(evt) {
if (evt.target.value == "w1") {
this.picklist2 = [{
value: 'v1',
label: 'v1'
},
{
value: 'v2',
label: 'v2'
}
];
}
if (evt.target.value == "w2") {
this.picklist2 = [{
value: 'v2',
label: 'v2'
},
{
value: 'v3',
label: 'v3'
}
];
}
}
I have tried above, but it updates all picklist2 in all rows.
But the component is working correctly, all the comboboxes in the right column are iterating over options that come from this.picklist2
, if you modify it, it will be modified in all of them, the last one you select will overwrite the rest.
you must directly overwrite it in the event, if you know the data-id for that secondary combobox, you must manipulate it with javascript and insert the new options.
Answered by Pirata21 on January 6, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP