AnswerBun.com

ui:input select on change event in lightning

Salesforce Asked by Mayank on December 21, 2020

I have one scenario in which wrapper list is iterating using aura iteration. Inside iteration there is one text field and one dropdown ui:inputselect and ui:inputSelectOption options are also coming dynamically which contains fields.
I want if one value in dropdown is changed, the text field gets changed.

For ex. If I select any date field from dropdown, the text field should be converted and one date picker should appear.

How to get which field is changed because we cannot have dynamic aura:id.

<aura:iteration items="{!v.wrapperList}" var="wrap" indexVar="i">
    <tr>
        <td>C:{!i+1}</td>                           

        <td>
            <ui:inputSelect multiple="false" value="{!wrap.fieldName}" class="form-control">
                <ui:inputSelectOption text="Select Field" label="Select Field" disabled="true" class="form-control"/>
                <aura:iteration items="{!v.objFieldsList}" var="fields">
                    <ui:inputSelectOption text="{!fields}" label="{!fields}" class="form-control"/>
                </aura:iteration>
            </ui:inputSelect>
        </td>

        <td>
            <ui:inputSelect multiple="false" value="{!wrap.opVal}" class="form-control">
                <ui:inputSelectOption value="=" text="EQUALS" label="EQUALS" class="form-control"/>
                <ui:inputSelectOption value="!=" text="NOT EQUALS" label="NOT EQUALS" class="form-control"/>
            </ui:inputSelect>
        </td>

        <td>
            <ui:inputText placeholder="Value" value="{!wrap.fieldVal}" class="form-control" required="true"/>
        </td>

    </tr>
</aura:iteration>

2 Answers

We use a simple workaround when detecting change events on specific rows. Assign a data attribute with the id value you are interested in to the closest HTML element (in your case the td). Then, in your event handler walk through the event.path array until you get to your td and pull the id out of the dataset.

Answered by dsharrison on December 21, 2020

You can use the change attribute and invoke a function from your controller like this:

 <ui:inputSelect multiple="false" value="{!wrap.opVal}" class="form-control" change="selectChangeHandler">

Inside your controller, you can hide/display fields using their aura:id attribute

Answered by prashanthkr on December 21, 2020

Add your own answers!

Related Questions

How to truncate a string to a specific length if it is longer?

4  Asked on February 10, 2021 by imajmdf

   

Update contact activity in Journey builder

1  Asked on February 10, 2021 by mary-jon

 

Hide iframe url

1  Asked on February 8, 2021 by cloudy-ritz

       

How can we add placeholder for lightning:InputField?

1  Asked on February 6, 2021 by aakash-poudel

 

LWC OSS Build Command

1  Asked on February 3, 2021 by scott-morrison

 

%%_PreHeader%% Personalization String

1  Asked on February 2, 2021 by victorcorey

   

Marketing cloud new Transactional Messaging API

1  Asked on January 30, 2021 by martijn-e

     

Can’t send to a list in marketing cloud?

1  Asked on January 30, 2021 by 4kaudio

     

Ask a Question

Get help from others!

© 2022 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP