Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
30
Igx-select does not work with Modal Forms
posted

In my angular app i am trying to use a custom component which is based on the igs-select which handles primarily how i get the data from backend and what to display. This custom component works fine if it is a regular  form. Bot if i try to use Angular Material to display the same form as a dialog it no longer works.

    editEmail(index: number, formArray: FormArray )
    {
        console.log(index)
        console.log(formArray.value[index])
            const dialogRef = this.dialog.open(EmailEdit,
                {
                    data: {DocId: formArray.value[index].id, Data: formArray.value[index], ParentId: this.formData.DocId, mode: 'edit'},
                    disableClose: true, width: '600px', position: {
                        top: '50px'
                    },
                })
            dialogRef.afterClosed().subscribe(
             ta => this.childEvent.emit(this.farm.DocId)
            );
        }
}
So my first thought was maybe i have a issue in my custom component but that doesn't seem to be the case because if i use the basic igx-select without anything else it still fails. When clicking on dropdown it never drops or displays any data. In the case of my component i can scroll thru list of values or use the first char of text to bring it up but the dropdown does not work when in dialog mode.
Is there a fix for that and if what causes it ?
Parents
No Data
Reply
  • 1560
    Offline posted

    Hello,


    I have been looking into the described behavior and created a sample using material dialog with form and igx-select in it. On my side, everything works as expected and I am able to select an item from the select component.


    Here could be found my sample for your reference. Please test it on your side and let me know how it behaves. If this is not an accurate demonstration of what you are trying to achieve please feel free to modify it and send it back to me along with steps to reproduce. Alternatively, if the behavior cannot be replicated please feel free to provide your own small isolated sample. Remove any external dependencies and code that is not directly related to the issue, zip your application and attach it in this case.


    Having a working sample on my side, which I can debug, is going to be very helpful in finding the root cause of this behavior.


    Thank you for your cooperation.


    Looking forward to hearing from you.


    Sincerely,
    Teodosia Hristodorova
    Associate Software Developer

Children