Dropdown client-side validation in IE7, using Html.ValidateFor() helper

Question

I have a weird issue regarding validation of dropdowns on my form. One drop down is a list of states and is decorated with RequiredAttribute:

[Required(ErrorMessage="State is required.")]

Inside the view, the dropdown and its validation are defined as:

<%: Html.DropDownListFor(m => m.State, new SelectList(BusinessLayer.UsStates.GetList())) %>
<% Html.ValidateFor(m => m.State); %>

UsStates.GetList() returns a List<string>. All my client-side validation (including dropdowns) works perfectly in Firefox, Chrome and even IE8. However, in IE7 it's broken - even when a state (and its value obviously) is properly selected in the dropdown, validation fails and says "State is required."

Solved my problem:

IE7 wasn't happy about the fact that the value attribute of each option wasn't rendered. So passing a List into the SelectList() didn't cut it. You have to pass in a list of key/value pair-type objects and pass in the DataValueField and DataTextField parameters, like this:

<%: Html.DropDownListFor(m => m.State, new SelectList(BusinessLayer.UsStates.GetList(), "Value", "Text"))%>

That was quite annoying.. :)

Answer 1

Solved my problem:

IE7 wasn't happy about the fact that the value attribute of each option wasn't rendered. So passing a List<string> into the SelectList() didn't cut it. You have to pass in a list of key/value pair-type objects and pass in the DataValueField and DataTextField parameters, like this:

<%: Html.DropDownListFor(m => m.State, new SelectList(BusinessLayer.UsStates.GetList(), "Value", "Text"))%>

That was quite annoying.. :)