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
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to Get Selected Value in Multiselect Dropdown

Thread ID:

Created:

Updated:

Platform:

Replies:

148516 Oct 23,2019 11:35 AM UTC Nov 11,2019 10:03 AM UTC ASP.NET Core - EJ 2 9
loading
Tags: MultiSelect Dropdown
Naga Padmasree
Asked On October 23, 2019 11:35 AM UTC

Hi,

How can i get selected value in multiselect dropdown.


 @(Html.EJS().MultiSelect("ddlFilterEmployee")
                                                                                                                                         .AllowFiltering()
                                                                                                                                         .FloatLabelType(FloatLabelType.Auto)
                                                                                                                                         .Width("100%").ShowSelectAll(true).ShowDropDownIcon(true)
                                                                                                                                         .DataSource(datasource => datasource.Url(@Url.Action("GetEmployees"))
                                                                                                                                                       .Adaptor("UrlAdaptor"))
                                                                                                                                         .Mode(Syncfusion.EJ2.DropDowns.VisualMode.CheckBox)
                                                                                                                                         .Fields(df => df.Text("Text").Value("Value"))
                                                                                                                                         .Placeholder(Localizer["Employee ID"].Value)
                                                                                                                                         .Select("onSelect")
                                                                                                                                         .Render())

Sureshkumar P [Syncfusion]
Replied On October 24, 2019 07:35 AM UTC

Hi Naga, 
 
Greetings from Syncfusion support. 
 
With shared code we have validated your requirement. Using our inbuild value property, we can get the selected value in the multiselect component Please refer to the block of code below. 
 
// Instance created on multiselect component 
        var multiselectObj = document.getElementById('ddlFilterEmployee').ej2_instances[0]; 
        // Get the selected value through Value property 
        console.log(multiselectObj.value); 
 
Regards, 
Sureshkumar P 


Naga Padmasree
Replied On October 24, 2019 10:30 AM UTC

Hi,

If i use Select("onSelect") and writing that code in that function i am getting null as checkbox is checked after the function.

how to get the value on click and write a function for that multiselect component.

  @(Html.EJS().MultiSelect("ddlFilterEmployee")
                                                                                                                                                 .AllowFiltering()
                                                                                                                                                 .FloatLabelType(FloatLabelType.Auto)
                                                                                                                                                 .Width("100%").ShowSelectAll(true).ShowDropDownIcon(true)
                                                                                                                                                 .DataSource(datasource => datasource.Url(@Url.Action("GetEmployees"))
                                                                                                                                                               .Adaptor("UrlAdaptor"))
                                                                                                                                                 .Mode(Syncfusion.EJ2.DropDowns.VisualMode.CheckBox)
                                                                                                                                                 .Fields(df => df.Text("Text").Value("Value"))
                                                                                                                                                 .Placeholder(Localizer["Employee ID"].Value)
                                                                                                                                                 .Select("onSelect")
                                                                                                                                                 .Render())


                            </div>

<script>
 function onSelect() {
        // Instance created on multiselect component 
        var multiselectObj = document.getElementById('ddlFilterEmployee').ej2_instances[0];
        // Get the selected value through Value property 
        console.log(multiselectObj.value); 
    }
</script>


Thank You.

Sureshkumar P [Syncfusion]
Replied On October 25, 2019 08:44 AM UTC

Hi Naga,

Your requirement has been validated in the selected event our component model value has not been updated. That's why null value is returned by the value property. In the change event we can get the value property. If you want the selected value to be obtained by select event, you can receive the value by using the event argument as below. 
 
Kindly refer the below code block. 
function OnSelect(args) { 
        var multiselectObj = document.getElementById('ddlFilterEmployee').ej2_instances[0]; 
        console.log(args.itemData[multiselectObj.fields.value]); 
    } 
 
For your convenience we created a sample based on your requirement. please find the sample here: https://www.syncfusion.com/downloads/support/forum/148516/ze/DropDownList270257173  
 
Regards, 
Sureshkumar P 


Naga Padmasree
Replied On October 25, 2019 10:15 AM UTC

Thank You its working :)

Berly Christopher [Syncfusion]
Replied On October 28, 2019 12:35 PM UTC

Hi Naga, 
 
We are glad  to hear that issue is resolved at your end. Please revert us if you need further assistance on this. We will be happy to assist you.  
 
Regards, 
Berly B.C 


Naga Padmasree
Replied On November 6, 2019 09:42 AM UTC

Hi,


If we want to have selected Checkboxes values in onSelect function how can we achieve that in syncfusion EJ2 Multiselect.

I want to send checked checkboxes values to controller.


Thank You


Sureshkumar P [Syncfusion]
Replied On November 7, 2019 06:46 AM UTC

Hi Naga, 
 
We can get the single selected value in the select event. We suggest using the change event instead of the select event to get the all selected value from value property. Also, we would like to say we have given new property to trigger change event while select the value through multiselect using “ChangeOnBlur”.  
 
Kindly refer the code block. 
 
@using Syncfusion.EJ2; 
@using Syncfusion.EJ2.Inputs; 
 
@Html.EJS().MultiSelect("ddlFilterEmployee").Change("OnChange").ChangeOnBlur(false).Placeholder("Select a Country").PopupHeight("200px").DataSource(dataManger => 
    dataManger.Url("/Home/UrlDatasource").Adaptor("UrlAdaptor").CrossDomain(true)).Fields(new Syncfusion.EJ2.DropDowns.MultiSelectFieldSettings 
    { 
        Value = "shipCountry", Text="shipCountry" 
    }).Render() 
 
<script> 
    function OnChange() { 
        var multiselectObj = document.getElementById('ddlFilterEmployee').ej2_instances[0]; 
        console.log(multiselectObj.value); 
    } 
</script> 
 
For your convenience we have modified the previous sample based on your requirement. please refer the sample here: https://www.syncfusion.com/downloads/support/forum/148516/ze/DropDownList517788674  
 
Regards, 
Sureshkumar P 


Krishna Prasad
Replied On November 8, 2019 06:39 AM UTC

Thank You issue Resolved.

Sureshkumar P [Syncfusion]
Replied On November 11, 2019 10:03 AM UTC

Hi Naga, 
 
Thanks for your update. Please get back to us if you need further assistance on this 
 
Regards, 
Sureshkumar P 


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