Apex Code Development You need to sign in to do that
Don't have an account?
tonante27 Unwanted Duplicate Dynamic List being generated for Lightning Component
Help please!: I have successfully created two different combo boxes in a lightning component. The first one displays account records using autocompletion while the second combo box displays user records using autocompletion. However when I type a user's name in the second combo box I notice that not only do I get a list of user records underneath the second (User) combo box, but I also get that same list of user records listed underneath the first (Account) combo box. I only want the dynamic list to appear underneath the second (User) combo box when I am searching for a specific group of users when using autocompletion . Thanks. Let me know if you need additional code.
- I need to set the following
to
- I need to also make sure that copy certain component attribute varaibles from the Account object and create them for the BDM ( User object ) where I affix 'BDM' string to the end of those variables.
- I need to do the same for the functions in the Handler. ( I know there could be a more convieniet way to do this without duplication so much code but I want to make sure it works before I attempt that.)
To prove this I did a portion of the two steps mentioend above and was able to see that the dynamic liust was only positioned under the combo box where I performed the autocompletion search..Where # is set to some alphanumeric number like '02' or '01'.
All Answers
<<USER BOX>>: <div class="slds-form-element slds-size_1-of-2 slds-m-horizontal_small"> <div class="slds-form-element-label"> <output value="BDM Sender" class="slds-form-element-label"></output> </div> <div class="slds-combobox_container slds-has-inline-listbox "> <div class="slds-combobox slds-dropdown-trigger slds-dropdown-trigger_click slds-is-open" aria-expanded="true" aria-haspopup="listbox" role="combobox"> <div class="slds-combobox__form-element slds-input-has-icon slds-input-has-icon_right"> <div> <aura:if isTrue="{! empty(v.bdmId) }"> <input type="text" class="slds-input slds-combobox__input" id="combobox-unique-2id" aria-activedescendant="listbox-option-unique-id-02" aria-autocomplete="list" aria-controls="listbox-unique-2id" autocomplete="on" role="combobox" placeholder="{!v.placeholderBDM}" value="{!v.bdmName}" onkeyup="{!c.serverCallBDM}" label="BDM Sender"/> </aura:if> <aura:if isTrue="{! !empty(v.bdmId) }"> <span class="slds-pill slds-pill_link fullWidth slds-m-around_xx-small"> <a href="javascript:void(0);" class="slds-pill__action slds-p-left_small slds-p-right_small" title="{!v.bdmName}"> <lightning:icon iconName="{!v.lookupIconBDM}" size="small"/> <span class="slds-pill__label slds-p-left_small slds-p-right_small">{!v.bdmName}</span> </a> <button onclick="{!c.clearSelectionBDM}" class="slds-button slds-button_icon slds-button_icon slds-pill__remove" title="Remove"> <lightning:icon iconName="utility:close" size="small" alternativeText="Press delete or backspace to remove"/> <span class="slds-assistive-text" >Remove</span> </button> </span> </aura:if> </div> </div> <aura:if isTrue="{! greaterthanorequal(v.server_result.length,1) }"> <div id="listbox-unique-id" role="listbox"> <ul class="slds-listbox slds-listbox_vertical slds-dropdown slds-dropdown_fluid" role="presentation" style="display: block; min-width: auto; max-width: 100% ; width: 100%;"> <aura:iteration items="{!v.server_result}" var="item" indexVar="i"> <li role="presentation" class="slds-listbox__item" data-selectedIndex="{#i}" id="{#i}" onclick="{!c.itemSelectedBDM}"> <span id="{#'User_'+i}" class="slds-media-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta" role="option"> <span class="slds-media__figure optionIcon"> <span class="slds-icon_container" > <lightning:icon iconName="{#v.lookupIconBDM}" size="small"/> <span class="slds-assistive-text">User</span> </span> </span> <span class="slds-media__body singleRow"> <span class="optionTitle slds-listbox__option-text slds-listbox__option-text_entity" >{#item.SObjectLabel}</span> </span> </span> </li> </aura:iteration> </ul> </div> </aura:if> </div> </div> </div> <<ACCOUNT BOX>>: <div class="slds-form-element slds-size_1-of-2 slds-m-horizontal_small"> <div class="slds-form-element-label"> <output value="Account" class="slds-form-element-label"></output> </div> <div class="slds-combobox_container slds-has-inline-listbox "> <div class="slds-combobox slds-dropdown-trigger slds-dropdown-trigger_click slds-is-open" aria-expanded="true" aria-haspopup="listbox" role="combobox"> <div class="slds-combobox__form-element slds-input-has-icon slds-input-has-icon_right"> <div> <aura:if isTrue="{! empty(v.accountId) }"> <input type="text" class="slds-input slds-combobox__input" id="combobox-unique-id" aria-activedescendant="listbox-option-unique-id-01" aria-autocomplete="list" aria-controls="listbox-unique-id" autocomplete="on" role="combobox" placeholder="{!v.placeholder}" value="{!v.accName}" onkeyup="{!c.serverCall}" label="Account"/> </aura:if> <aura:if isTrue="{! !empty(v.accountId) }"> <span class="slds-pill slds-pill_link fullWidth slds-m-around_xx-small"> <a href="javascript:void(0);" class="slds-pill__action slds-p-left_small slds-p-right_small" title="{!v.accName}"> <lightning:icon iconName="{!v.lookupIcon}" size="small"/> <span class="slds-pill__label slds-p-left_small slds-p-right_small">{!v.accName}</span> </a> <button onclick="{!c.clearSelection}" class="slds-button slds-button_icon slds-button_icon slds-pill__remove" title="Remove"> <lightning:icon iconName="utility:close" size="small" alternativeText="Press delete or backspace to remove"/> <span class="slds-assistive-text" >Remove</span> </button> </span> </aura:if> </div> </div> <aura:if isTrue="{! greaterthanorequal(v.server_result.length,1) }"> <div id="listbox-unique-id" role="listbox"> <ul class="slds-listbox slds-listbox_vertical slds-dropdown slds-dropdown_fluid" role="presentation" style="display: block; min-width: auto; max-width: 100% ; width: 100%;"> <aura:iteration items="{!v.server_result}" var="item" indexVar="i"> <li role="presentation" class="slds-listbox__item" data-selectedIndex="{#i}" id="{#i}" onclick="{!c.itemSelected}"> <span id="{#'Account_'+i}" class="slds-media slds-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta" role="option"> <span class="slds-media__figure optionIcon"> <span class="slds-icon_container" > <lightning:icon iconName="{#v.lookupIcon}" size="small"/> <span class="slds-assistive-text">Account</span> </span> </span> <span class="slds-media__body singleRow"> <span class="optionTitle slds-listbox__option-text slds-listbox__option-text_entity" >{#item.SObjectLabel}</span> </span> </span> </li> </aura:iteration> </ul> </div> </aura:if> </div> </div> </div>- I need to set the following
to
- I need to also make sure that copy certain component attribute varaibles from the Account object and create them for the BDM ( User object ) where I affix 'BDM' string to the end of those variables.
- I need to do the same for the functions in the Handler. ( I know there could be a more convieniet way to do this without duplication so much code but I want to make sure it works before I attempt that.)
To prove this I did a portion of the two steps mentioend above and was able to see that the dynamic liust was only positioned under the combo box where I performed the autocompletion search..Where # is set to some alphanumeric number like '02' or '01'.