CODEWITHSUNDEEP
htmlasp.net-mvcpostdrop-down-menu
Brij
Brij

Reputation: 13129

Get value of disabled drop down in asp.net mvc

I have an ASP.NET MVC application. I am having multiple drop-down list in my page (HTML SELECT), I have to disable them, as user goes on selected them one by one. When the user posts it back to the controller, I am getting null as the function (action method) paramters. I searched and found that HTML does not send value of disabled fields in the form data. Replacing disabled attribute with readonly would not work as it would render drop-down working.

I am generating the dropdowns dynamically using javascript as user goes on. So there isn't a single dropdown, but as many as user wants.

Can someone please tell me how should I get the values ?

Upvotes: 26

Views: 31959

Answers (5)

Mohammed Osman
Mohammed Osman

Reputation: 4236

Create a hidden field with a specified Id and set it before disabling the drop-down-list.

In MVC,

@Html.DropDownListFor(x => x.FooId, Model.Foos)
@Html.HiddenFor(x => x.FooId, new { @id = "hdnFooId" })

In JQuery,

function handleDropDownListFooChange(){
    // Get the selected value from drop-down-list before disabling it.
    var selectedFooId = $('#FooId').val();
    $('#FooId').prop("disabled", "disabled");
    $("#hdnFooId").val(selectedFooId);

    // Load any data the depends on selected FooId using `selectedFooId` variable.
}

The selected value will automatically be binded to Model.FooId.

Upvotes: 0

raza
raza

Reputation: 21

before submit call $('#FooId').removeAttr('disabled')

Upvotes: -1

Peter
Peter

Reputation: 14508

You could also create your own DropDownListFor overload which accepts a bool disabled parameter and does the heavy lifting for you so your view isn't cluttered with if disablethisfield then ....

Something among these lines could do:

public static MvcHtmlString DropDownListFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, IEnumerable<SelectListItem> selectList, bool disabled)
{
    if (disabled)
        return MvcHtmlString.Create(htmlHelper.HiddenFor(expression).ToString() + htmlHelper.DropDownListFor(expression, selectList, new { disabled="disabled" }).ToString());
    else
        return htmlHelper.DropDownListFor(expression, selectList);
}

There are 6 overloads for DropDownListFor alone so it's a lot of monkeycoding but it pays off in the end imho.

Upvotes: 3

Felipe Oriani
Felipe Oriani

Reputation: 38598

This is the default behavior of disabled controls. I suggest you to add a hidden field and set the value of your DropDownList in this hidden field and work with this.

Something like:

//just to create a interface for the user
@Html.DropDownList("categoryDump", (SeectList)ViewBag.Categories, new { disabled = "disabled" });
// it will be send to the post action
@Html.HiddenFor(x => x.CategoryID)

Upvotes: 3

Darin Dimitrov
Darin Dimitrov

Reputation: 1038730

One possibility is to make the dropdown list disabled="disabled" and include a hidden field with the same name and value which will allow to send this value to the server:

@Html.DropDownListFor(x => x.FooId, Model.Foos, new { disabled = "disabled" })
@Html.HiddenFor(x => x.FooId)

If you have to disabled the dropdown dynamically with javascript then simply assign the currently selected value of the dropdown to the hidden field just after disabling it.

Upvotes: 65

Related Questions