How do I select an item in the DropDownList at creation time?

[Eric Outley]

I'm trying to use the data-binding feature to of the dropdown control to set the selected item.  

I have the following code:  @Html.EJ().DropDownList("modelList").Datasource(data).DropDownListFields(df => df.ID("DataModelID").Text("Name").Value("DataModelID").Selected("IsSelected")).Width("300")

However, when the screen is loaded nothing is selected in the dropdown list.  

The field "IsSelected" is a boolean field on the data source.

[Saranya Sivakumar]

Hi Eric,

Thanks for using Syncfusion products.

We are having a Dropdownlist Field called “Selected” in order to select items in the Dropdownlist. The items which contains the “Selected” field as true will be selected in the Dropdownlist control. For this we have to enable ShowCheckbox API. We have to set “true” to the ShowCheckbox API to the Dropdownlist control as shown in the following code snippet.

<code>

@Html.EJ().DropDownList("countryList").Datasource((IEnumerable<Countries>)ViewBag.datasource).DropDownListFields(ddl=>ddl.Text("ddlText").Value("ddlValue").ID("ParentId").Selected("isSelected")).ShowCheckbox(true)

</code>

If we didn’t enable the checkbox then the “Selected” field will not be reflected in the Dropdownlist control. For your convenience we have prepared the sample based on your requirement and the same can be downloaded from the following location.

http://www.syncfusion.com/uploads/user/forum/119495/ze/DDLSelect130Field1006829851

If you don’t want to enable Checkbox then we can select the item using an API called “SelectedItemIndex”. It is used to display the Item text which we have pass the index of an item as shown in the following code snippet.

<code>

@Html.EJ().DropDownList("countryList").Datasource((IEnumerable<Countries>)ViewBag.datasource).SelectedItemIndex(2)

</code>

Here the second index item will be displayed in the Dropdownlist control. In order to display multiple items without using Checkbox we have already logged a defect report regarding this. A support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

You can find the UG documentation for API’s in the following online link.

http://help.syncfusion.com/ug/js/index.html#!Documents/behavioursettings.htm

You can also refer the following class reference link for JavaScript. Since, our ASP.NET MVC components are created as wrapper for the JavaScript components the properties, methods and events will be same for MVC components.

http://help.syncfusion.com/cr/js

Also we have a documentation which contains more detailed information of our controls for getting started. You can find it under the following link.

http://help.syncfusion.com/web

Please let us know if you have any other queries.

Regards,

Saranya.S

[Bruno Figueiredo]

Well, 

I have the same question has Eric Outley, and when I saw that this thread is more than 2 years old, I was expecting the DropDownList to have some new method to bind the control to the selected ITEM.

.SelectedItemIndex(2)  is not enought. Something like .SelectedItem and .SelectedItems (for the multiselect) would be ideal and easy (I think) to implement.

So, Why not?

[Prince Oliver]

Hi Bruno, 

Thank you for contacting Syncfusion forums. 

For single select DropDownList, you can use the following properties to select a value at creation time. 

Text Property: https://help.syncfusion.com/api/js/ejdropdownlist#members:text 

@Html.EJ().DropDownList("skillsets").Datasource((IEnumerable<Languages>)ViewBag.datasource).DropDownListFields(f => f.Text("text")).WatermarkText("Select your skill").Width("100%").Text("C") 

Value Property: https://help.syncfusion.com/api/js/ejdropdownlist#members:value 

@Html.EJ().DropDownList("skillsets").Datasource((IEnumerable<Languages>)ViewBag.datasource).DropDownListFields(f => f.Text("text")).WatermarkText("Select your skill").Width("100%").Value("C++") 

SelectedIndex property: https://help.syncfusion.com/api/js/ejdropdownlist#members:selectedindex 

@Html.EJ().DropDownList("skillsets").Datasource((IEnumerable<Languages>)ViewBag.datasource).DropDownListFields(f => f.Text("text")).ShowCheckbox(true).WatermarkText("Select your skill").Width("100%").SelectedIndex(0) 

For Multiselect Mode, you can use pass multiple values in the text and value property separated by a comma(,) and for selectedIndices property, you need to pass the multiples indices as list.  

Text and value property:  

@Html.EJ().DropDownList("skillsets").Datasource((IEnumerable<Languages>)ViewBag.datasource).DropDownListFields(f => f.Text("text")).ShowCheckbox(true).WatermarkText("Select your skill").Width("100%").Text("C,C++").Value("C, C++") 

SelectedIndices property: https://help.syncfusion.com/api/js/ejdropdownlist#members:selectedindices 

@Html.EJ().DropDownList("skillsets").Datasource((IEnumerable<Languages>)ViewBag.datasource).DropDownListFields(f => f.Text("text")).ShowCheckbox(true).WatermarkText("Select your skill").Width("100%").SelectedIndices(new List<int>() { 1,2 }) 

Kindly refer to the following link for the sample: http://www.syncfusion.com/downloads/support/forum/119495/ze/DDLValueSelect-923639052 

Regards, 

Prince