We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

MultiSelect control does not work in a modal dialog when mode="CheckBox"

If you take your own sample application,https://stackblitz.com/edit/angular-m5h4j7 , and modify the multiselect control by adding Mode="CheckBox", you will see that it no longer works in the modal dialog. Is there a workaround for this?

3 Replies

PO Prince Oliver Syncfusion Team November 30, 2018 05:48 AM UTC

Hi Michael, 

Thank you for contacting Syncfusion support. 

To use MultiSelect component in CheckBox mode, make sure that you have imported the MultiSelectAllModule in the app.module.ts file 

import { MultiSelectAllModule } from '@syncfusion/ej2-ng-dropdowns'; 
  imports:      [ BrowserModule,DialogModule, FormsModule ,DropDownListModule,MultiSelectAllModule,CheckBoxModule], 

Now you need to define the mode as string. Kindly refer to the below code. 

public mode: string = 'CheckBox'; 

<ejs-multiselect id='multiselectelement' #sample [dataSource]='countries' [fields]='localFields' [placeholder]='localWaterMark' [mode]='mode' [hideSelectedItem] = 'false' [value]='value1'>  

We have attached the modified sample for your reference, please refer to the following link: https://stackblitz.com/edit/angular-jjq8yu 


MR Michael Rodriguez November 30, 2018 04:00 PM UTC

Ok so the problem is that it specifically doesn't work in the Bootstrap modal dialog, it works in the SyncFusion modal dialog. I'm just going to switch to using the SyncFusion modal dialog instead.


PO Prince Oliver Syncfusion Team December 3, 2018 04:56 AM UTC

Hi Michael, 

Thank you for the update. We are glad to know the issue is resolved in your end. Please let us know if you require any further assistance on this. 


Live Chat Icon For mobile
Up arrow icon