[SOLVED] How do I disable dropdown if populated when the page loads

How do I disable dropdown if populated when the page loads

This drop down list is sometimes populated based on a search result. When the fields is populated, it needs to be disabled, so that the selection cannot be changed. But when the page is loaded without a result populating the field, it needs to be active.

@Html.DropDownListFor(m => m.SelectedOptions, new SelectList(this.Model.Options, "Key", "Value"), "Select...", new { @id = "ddlOption" + this.ViewBag.TabId, tabindex = 5001 })

Is there a way to accomplish this?

Solution

You can optionally build the htmlAttributes parameter to include disabled or you would use javascript to enable/disable it

Include disabled attribute when need to and leave it out when needs to be enabled

// Conditional check for list size, if populated, then
@Html.DropDownListFor(m => m.SelectedOptions, new SelectList(this.Model.Options, "Key", "Value"), "Select...", new { @id = "ddlOption" + this.ViewBag.TabId, tabindex = 5001, disabled = true })
// else, your original code

javascript version

// The placeholder is one of the default options, so length at least equals to 1
if (document.getElementById('ddlOption').children.length > 1) {
  document.getElementById('ddlOption').disabled = true;
}