<template>
|
<div>
|
<div class="slds-form-element" >
|
|
<label class="slds-form-element__label" for="combobox-id-2">{label}</label>
|
<div class="slds-form-element__control">
|
<div class="slds-combobox_container" >
|
<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" role="none">
|
<input type="text" class="slds-input slds-combobox__input slds-has-focus" id="combobox-id-2" aria-autocomplete="list" aria-controls="listbox-id-2" autocomplete="off" role="textbox" value={InputValue} placeholder={placeholder} onkeyup={searchchange} onclick={searchClick} onblur={onblurFn} />
|
<!-- <input type="text" value={InputValue} placeholder={placeholder} onkeyup={searchchange} onclick={searchClick} onblur={onblurFn} /> -->
|
|
</div>
|
|
<div id="listbox-id-2" class="slds-dropdown slds-dropdown_length-with-icon-7 slds-dropdown_fluid" role="listbox" if:true={isShow} >
|
<div class="exampleHolder" if:true={IsLoading}>
|
<lightning-spinner alternative-text="Loading" size="large"></lightning-spinner>
|
</div>
|
<ul class="slds-listbox slds-listbox_vertical" role="presentation" >
|
|
<template for:each={ShowData} for:item="item">
|
<li role="presentation" class="slds-listbox__item" key={item.Id} onclick={itemclick} title={item.value1}>
|
<div id={item.Id} class="slds-media slds-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta" role="option" >
|
<span class="slds-media__figure slds-listbox__option-icon">
|
<span class="slds-icon_container slds-icon-standard-account">
|
<lightning-icon icon-name="standard:account" alternative-text="Account" title="Account"></lightning-icon>
|
</span>
|
</span>
|
<span class="slds-media__body" data-id={item.Id} >
|
<span class="slds-listbox__option-text slds-listbox__option-text_entity" data-id={item.Id} style="font-size:small">{item.value1}</span>
|
<span class="slds-listbox__option-meta slds-listbox__option-meta_entity" data-id={item.Id}>{item.value2}</span>
|
</span>
|
</div>
|
</li>
|
</template>
|
</ul>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
|
</template>
|
