Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

DropDownListFor with a custom attribute with - in attribute name?

Question: I need to create a dropdownlist like this:

<select id="ddCustomers" data-placeholder="Choose a customer" class="chzn-select" style="width:350px;" tabindex="1" multiple> 

Now I can add custom attributes like this:

@Html.DropDownListFor(m => m.Id, Model.Values, new { @disabled = "disabled" }) 

Unfortunately, if there is a "-" in the variable name, then it doesn't compile.

@Html.DropDownListFor(m => m.Id, Model.Values, new { @disabled = "disabled", @data-placeholder = "whatever" }) 

And what about the multiple, which has no attribute value ?

If I pass a Dictionary or a NameValueColletion instead of the new { @disabled = "disabled" }, then it outputs the properties of the NameValueColletion/Dictionary...

How can I pass attributes with special characters in the attribute key ?

like image 313
Stefan Steiger Avatar asked Oct 06 '12 11:10

Stefan Steiger


People also ask

What are custom attributes?

Custom attributes. A custom attribute is a property that you can define to describe assets. Custom attributes extend the meaning of an asset beyond what you can define with the standard attributes. You can create a custom attribute and assign to it a value that is an integer, a range of integers, or a string.


2 Answers

Use an underscore instead

@data_placeholder = "whatever" 

Since Mvc3 "_" is replaced with "-" when rendered. This applies to Mvc5 too.

This works fine as underscores are not acceptable in attribute names in html.

like image 174
dove Avatar answered Sep 22 '22 06:09

dove


Ah, it's easy.
The mistake was to declare a dictionary of <string, string> instead of a dictionary of <string, object> (and to use variables instead of properties in cOption)...


With dictionary of <string, string> it uses the object "paramlist" overload, instead of IDictionary<string, object> ;)

@Html.DropDownListFor(model => model.Title, new SelectList(Model.ls, "value", "text"), Model.nvc)   <!--  @Html.DropDownList("myIdAndName", new SelectList(Model.ls, "value", "text"), Model.nvc)  -->         public ActionResult Index()     {         cHomeModel HomeModel = new cHomeModel();          HomeModel.nvc.Add("class", "chzn-select");         HomeModel.nvc.Add("data-placeholder", "Choose a customer");         HomeModel.nvc.Add("style", "width:350px;");         HomeModel.nvc.Add("tabindex", "1");         HomeModel.nvc.Add("multiple", "multiple");         HomeModel.nvc.Add("id", "lol");           cOption option = null;           for (int i = 0; i < 10; ++i)         {             option = new cOption();              option.value = i.ToString();             option.text = "text" + i.ToString();              HomeModel.ls.Add(option);         }           return View(HomeModel);     }          public class cOption     {         public string value         {             get;             set;         }          public string text         {             get;             set;         }      }       public class cHomeModel     {         public string Title = "MyDropDownListName";         public List<cOption> ls = new List<cOption>();           public System.Collections.Generic.Dictionary<string, object> nvc = new System.Collections.Generic.Dictionary<string, object>();      } 

or more Linqiq:

public ActionResult Index() {     cHomeModel HomeModel = new cHomeModel();      HomeModel.nvc.Add("class", "chzn-select");     HomeModel.nvc.Add("data-placeholder", "Choose a customer");     HomeModel.nvc.Add("style", "width:350px;");     HomeModel.nvc.Add("tabindex", "1");     HomeModel.nvc.Add("multiple", "multiple");     HomeModel.nvc.Add("id", "lol");       HomeModel.ls = System.Linq.Enumerable.Range(0, 9)             .Select(x => new cOption() { text = x.ToString(), value = x.ToString() })             .ToList();       // or otherwise:      HomeModel.ls = (                  from i in System.Linq.Enumerable.Range(0, 9)                  select new cOption() { text = i.ToString(), value = i.ToString() }     ).ToList();       return View(HomeModel); } 
like image 25
Stefan Steiger Avatar answered Sep 22 '22 06:09

Stefan Steiger