Please describe the question in detail and share your code, configuration, and other relevant info.
I have an ion-search bar which makes an api call and returns a list that matches the filtered search. I display that list underneath the search bar using an ion-popover with a list of items returned from the search. Once a user selects the item it is displayed in the ion-search bar. My issue is after i open the popover with the filtered list the user is no longer able to type into the searchbar unitl after i dismiss the popover. Is there anyway to to make the popover or backdrop not take up the full screen so the user can still type in the input.
type="text" debounce="500" [formControl]="overrideFormControl" (ionChange)="getItems($event)">
</div>
async presentPopover() {
console.log("insside modal list")
const popover = await this.popover.create({
component: ModalListComponent ,
componentProps: {sicArray: this.siccodeArray},
cssClass: 'popover_setting',
showBackdrop: false,
});
popover.onDidDismiss().then((result) => {
console.log("onDidDismiss: ", result.data);
this.selectedSic = result.data;
});
return await popover.present();
/** Sync event from popover component */
}
1 post - 1 participant