Disable Dropdownlist in View

Question

Class

public class ConfiguracaoEstado
{
  ....

  [Required(ErrorMessage = "Selecione ao menos um estado.")]
  [Display(Name = "Estado")]
  public int EstadoID { get; set; }

  ...
}

Controller

private void createViewBag(ConfiguracaoEstado configuracaoestado)
{
  ViewBag.EstadoID = new SelectList(db.Estado, "Id", "uf", configuracaoestado.EstadoID);
  ....
}

View

<div class="form-group">
  @Html.LabelFor(model => model.EstadoID, "Estado", new { @class = "control-label col-md-2" })
  <div class="col-md-10">
           @Html.DropDownList("EstadoID", String.Empty);
           @Html.ValidationMessageFor(model => model.EstadoID)
  </div>
</div>

I wish that when executing ActionResult Edit(int? id) the DropDownList was disabled.

I tried so:

@Html.DropDownList("EstadoID", String.Empty, new { disabled =  Model != null});

and it didn’t work.

So I tried it like this:

@Html.DropDownListFor(model => model.EstadoID,
                       (SelectList)ViewBag.EstadoID,
                       String.Empty, new {disabled = Model != null}
                     )

Then the next thing happens:

1. Disables control, but does not display the content of DropDownList.
2. Retires the String.Empty, displays the contents, but not what is saved, but the first of the table.

With bringing the correct content of DropDownList and disable it?

Answer 1

At the top of your View, you can do the following:

@{
    ddlProps = new { } as object;
    if (Model != null)
    {
        ddlProps = new { @readonly = "readonly", @disabled = "disabled"};
    }
}

Then do the following in the Helper override the method.

@Html.DropDownList("EstadoID", String.Empty)

Thus:

@Html.DropDownList("EstadoID", null,String.Empty,ddlProps);

Just a hint on implementing your Controller: Use a Bind to remove Estadoid in Action from your control, just to be safe.

public ActionResult MyAction([Bind(Exclude = "EstadoID")]MyObject model)

Answer 2

You can use Jquery.

In the View that renders the editing page, you normally display your dropdownlist, but adds the following Jquery code:

   $(document).ready(function() {
         $("#EstadoID").prop("disabled", true);   
   });

   ... 

   @Html.DropDownListFor(model => model.EstadoID, (SelectList)ViewBag.EstadoID)

   ...

Or

  $(document).ready(function() {
          $("#EstadoID").attr('disabled','disabled');  
    });

   ... 

   @Html.DropDownListFor(model => model.EstadoID, (SelectList)ViewBag.EstadoID)

   ...

If you are interested, the link below has another way to render a dropdownlist

How popular Dropdownlistfor with information from a foreign key?