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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

MultiSelect - on loading the control it shows "2 items selected" instead of the values selected

Thread ID:

Created:

Updated:

Platform:

Replies:

149432 Nov 26,2019 09:10 AM UTC Nov 26,2019 12:35 PM UTC ASP.NET Core - EJ 2 3
loading
Tags: MultiSelect Dropdown
Elena Popova
Asked On November 26, 2019 09:10 AM UTC

Hi,
I am using the component ejs-multiselect. I have a simple form and when I open it for edit I have items preselected in the control. The problem is when i open the form and i have 2 preselected items, for example, the text of the multiselect is "2 items selected" instead of "John Smith, Bella Simpson". Can you please tell me how to configure the control so that when I open the form i see the names and not how much items i have selected.
This is my code:
 <ejs-multiselect id="AssignedUsersIds" floatLabelType="Auto" popupHeight="350px" value="@Model.Result.AssignedUsersIds" placeholder="@Localizer.GetLocalizedHtmlString("AssignedTo")" >
                                <e-data-manager adaptor="UrlAdaptor" url="@Url.Action("UrlDatasourceUserPerson", "Collections")"></e-data-manager>
                                <e-multiselect-fields text="PersonFullName" value="userId"></e-multiselect-fields>
                            </ejs-multiselect>


I also attach 2 files: MultiSelect_HowItAppears.PNG and MultiSelect_HowItShouldAppear.PNG to illustrate the situation.
Thank you in advance for the help!!

Sevvandhi Nagulan [Syncfusion]
Replied On November 26, 2019 10:48 AM UTC

Hi Elena 
 
Greetings from Syncfusion support. 
 
We cannot able to see the attached screenshot. But we suspect that you were placed the component inside tab or boostrap modal. The cause of the issue is, when the parent component’s is in display none, then parent component overrides the child component width. So MultiSelect component width is not properly calculated. To get rid of the reported issue, we suggest to call the refresh method as mentioned below, 
 
If you have  placed the component inside bootstrap modal, then call the refresh method in the modal open event, 
             $(function () { 
        $('#myModal').on('shown.bs.modal', function () { 
            document.getElementById('AssignedUsersIds').ej2_instances[0].refresh(); 
        }); 
    }); 
 
If have placed the component inside Syncfusion tab, then  call the refresh method in the tab selected event, 
 
   function selected() { 
        document.getElementById('AssignedUsersIds').ej2_instances[0].refresh(); 
    } 
 
 
Please find the sample below, 
 
 
 
Regards, 
Sevvandhi N 


Elena Popova
Replied On November 26, 2019 12:22 PM UTC

The control was in a modal indeed. Your code worked for me. Thank you very much :)

Sevvandhi Nagulan [Syncfusion]
Replied On November 26, 2019 12:35 PM UTC

Hi Elena, 
  
Most welcome. Please let us know if you need any further assistance.  
  
Regards, 
Sevvandhi N 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon