Enable/Disable a 'DropDownListFor' on a checkbox selection

Question

I am working show the drop down values on selection of a check box. But with the below code, all different items that are present in the drop down coming directly.

Somehow the @Html.DropDownListFor is not working inside select tag, can anyone please help me to fix it?

Note: Checkbox toggle working perfectly.

Thank you,

.cshtml

<input type="checkbox" /> 
<p>check this box to escalate</p>          
<select disabled="disabled">    
@Html.DropDownListFor(
    model => model.EscalationQueue,
        new SelectList(Extensions.EscalationQueue, Model.EscalationQueue),
          new { @class = "escalation-queue", name = Model.EscalationQueue }
)  
</select>

.js file

var dropdownToggle = function () {
    $("input:checkbox").change(function () {
        if ($("input:checkbox").is(":checked")) {
            $("select").removeAttr("disabled");
        }
        else {
            $("select").attr("disabled", "disabled");
        }
    });
}

$(document).ready(function () {
    dropdownToggle();
});

Output:

CurrentOutput1

CurrentOutput2

Gabe · Accepted Answer · 2012-06-15 00:53:00Z

4

You dont need the <select> tag, the HtmlHelper DropDownListFor will render that for you. If you want to initialize the dropdown as disabled set the html attribute as you did for declaring a cssclass...

<input type="checkbox" /> 
<p>check this box to escalate</p>  
@Html.DropDownListFor(
        model => model.EscalationQueue,
        new SelectList(Extensions.EscalationQueue, Model.EscalationQueue),
        new { @class = "escalation-queue", 
                name = Model.EscalationQueue, 
                disabled= "disabled" 
         }
)

answered Jun 15, 2012 at 0:53

Gabe

50.6k29 gold badges147 silver badges182 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jasper Manickaraj Over a year ago

Suppose i need to disable the DropDownList instead of DropDownListFor means where i have to give the disabled= "disabled"

ravithejag Over a year ago

Hi, I want to disable/enable the dropdown for specific pages only based on the value,i am passing it through model. i tried passing true / false to the disabled but it's not working .can you help in this

Jogi Over a year ago

@JasperManickaraj, For that, please visit this link

Collectives™ on Stack Overflow

Enable/Disable a 'DropDownListFor' on a checkbox selection

.cshtml

.js file

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

.cshtml

.js file

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related