0

I have below parent component and child component . From Parent component button click i want to assign child component picklist value as Cold. But its not working.

Parent HTML

     <lightning-button label="Cold" onclick={handleCold}></lightning-button>
      
      handleCold(e) {
        this.template.querySelector('.followupsubject').value = 'Cold';
        this.followupsubject = this.template.querySelector('.followupsubject').value;
      }
    
      <c-picklistutil onselected={handlefollowUpSubjectChange} value={followupsubject} object-name="Task"
               field-name="Type" label="Subject" class="followupsubject">
       </c-picklistutil>

Child HTML

       <div class="slds-form-element__control">
    <div class="slds-select_container">
        <select class="slectval slds-select" name={index} onchange={selectionChangeHandler}
            disabled={isPicklistDisabled} required={isAttributeRequired}>
            <template for:each={options} for:item="option">
                <option key={option.label} class="uiInputSelectOption" value={option.value}>
                    {option.value}
                </option>
            </template>
        </select>
    </div>
</div>

Child JS

@track _value;
     @api
     get value() {
        return this._value;
     }

     set value(val) {
     this._value = val;
     }
     
     renderedCallback() {
         
     }

     selectionChangeHandler(event) {
        let index = this.index
        let changes = event.target.value
        this.dispatchEvent(
            new CustomEvent('selected', { detail: { index, changes } })
        )
     }
1
  • You never assign a value to the select list, so it won't update. I'm mobile right now, but you just need to set selectedIndex on the select element.
    – sfdcfox
    Apr 6, 2021 at 15:43

1 Answer 1

0

Since you are using a regular HTML select box. JS would have to be used to change the value inside the set Value:

  set value(val) {
    const opt = this.template.querySelector('.slectval');
    if(opt)opt.value= val;
    this._value = val;
 }

I would recommend to use Lightnings lightning-combobox which you could bind values to.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .