Checkbox disabled attribute in ASP.NET MVC

2019-01-15 04:55发布

My ViewModel has a property of selected and selectable. Both are boolean. I would like my view to have a checkbox that is enabled when selectable is true and disabled when selectable is false. What is the proper razor syntax to accomplish this ?

I tried the code below on a list of items in a table. Every row comes back with a disabled checkbox regardless of selectable value.

 @Html.CheckBoxFor(modelItem => item.Selected, new { @disabled = !item.Selectable })

3条回答
爱情/是我丢掉的垃圾
2楼-- · 2019-01-15 05:33

This won't work because <input disabled="anything" /> will result in a disabled control. You need to only have a @disabled property when it should be disabled.

Try something like this:

@Html.CheckBoxFor(modelItem => item.Selected, item.Selectable ?  (object)new {} :  (object)new { @disabled = "disabled" })

Note that you might need to cast to (object)

查看更多
闹够了就滚
3楼-- · 2019-01-15 05:44

Sorry, my previous answer was wrong.

The input-element will be disabled as soon as it gets the attribute disabled. It doesn't matter if the value is true, false. In HTML you can't set disabled to false.

So you will have to set the disabled attribute only when the condition is valid.

something like:

object attributes = null;
if (!item.Selectable)
{
    attributes = new { disabled = "disabled"};
}
@Html.CheckBoxFor(modelItem => item.Selected, attributes)
查看更多
叼着烟拽天下
4楼-- · 2019-01-15 05:52

It is not easy to achieve this with an if condition inside the helper method because all the below markups will render a disabled chechbox.

<input type="checkbox" disabled>
<input type="checkbox" disabled="disabled">
<input type="checkbox" disabled="false">
<input type="checkbox" disabled="no">
<input type="checkbox" disabled="enabled">

This should work in the razor. Simple If condition and rendering what you want.

@if(item.Selected)
{ 
  @Html.CheckBoxFor(modelItem => item.Selected)
}
else
{
    @Html.CheckBoxFor(modelItem => item.Selected, new { @disabled = "disabled"})
}

You may consider writing a custom html helper which renders the proper markup for this.

查看更多
登录 后发表回答