Passing additional values with the dropdown list

Thread ID:	Created:	Updated:	Platform:	Replies:
143254	Mar 11,2019 08:07 PM UTC	Mar 12,2019 09:50 AM UTC	ASP.NET MVC	1

Subscribe to this post

Tags: DropDownList

Nate Greene

Asked On March 11, 2019 08:07 PM UTC

I have a general question about the dropdown list. I have a given DropdownList widget like so:

@Html.EJ().DropDownList("MenuItemsList")

.Datasource((List<MenuItemsDropdownModel>)ViewBag.RecipeDropdown)

.DropDownListFields(df => df.ID("MenuItemID")

.Text("Name")

.Value("MenuItemID"))

.ClientSideEvents(e => e.Select("onMenuItemSelect"))

.EnablePersistence(true)

.EnableFilterSearch(true)

.WatermarkText("Select a Menu Item")

.Width("100%")

The way it is setup is to recieve the data from the model that is passed to it. I understand how the .Text() and .Value() assignments work but I am wondering if there is a way I could hide additional data in the dropdown list that can be obtained when the Select event is activated. I know with a grid I can hide a column but still get the data in javascript when iterating through the object. Is there a similar functionality that I can use here? Because I need to save an the ItemName, ItemID and ItemCost to be used when a user selects one of the options from the dropdown.

Many Thanks,

Nate

Reply | Reply with quote

Prince Oliver [Syncfusion]

Replied On March 12, 2019 09:50 AM UTC

Hi Nate,

Thank you for contacting Syncfusion support.

Based on your shared information and your requirement, we suggest you bind only text field for DropDownList and get other field data through select event for DropDownList. You need to map “Text” field with required field name and get the other field details by iterating through getListData() method of DropDownList which contains complete data with all fields. Kindly refer to the following code snippet.

[View]

@Html.EJ().DropDownList("MenuItemsList").Datasource((IEnumerable<Data>)ViewData["DropDownSource"]).DropDownListFields(Df => Df.Text("Text")).ClientSideEvents(e => e.Select("onMenuItemSelect")).WatermarkText("Select a Menu Item").EnablePersistence(true).EnableFilterSearch(true)

function onMenuItemSelect(args) {

for (i = 0; i < this.getListData().length; i++) {

if (this.getListData()[i].Text == args.text) {

console.log(this.getListData()[i].Value);

console.log(this.getListData()[i].MenuItemID);

}

</script>

[Controller]

public ActionResult DropdownlistFeatures()

{

List<Data> DropDownData = new List<Data>();

DropDownData.Add(new Data { MenuItemID = "item1", Text = "ListItem 1" ,Value = "1" });

DropDownData.Add(new Data { MenuItemID = "item2", Text = "ListItem 2" , Value = "2" });

DropDownData.Add(new Data { MenuItemID = "item3", Text = "ListItem 3" , Value = "3" });

DropDownData.Add(new Data { MenuItemID = "item4", Text = "ListItem 4" , Value = "4" });

DropDownData.Add(new Data { MenuItemID = "item5", Text = "ListItem 5" , Value = "5" });

ViewData["DropDownSource"] = DropDownData;

return View();

}

Note: While mapping Text field without value, text will be considered as value of DropDownList.

We have attached sample for your reference, please find the sample at the following location: http://www.syncfusion.com/downloads/support/forum/143254/ze/SyncfusionMvcApplication1-67691720

Kindly check the above solution in your end and if it does not meet your requirement, kindly share additional information on your scenario with code or example. This will help us provide a prompt solution at the earliest.

Regards,

Prince

Reply | Reply with quote

Passing additional values with the dropdown list

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US