MVC4: HTML5 boolean attributes rendered with True/False value

Question

I'm trying to render a radiobutton with some boolean attributes (required and disabled) using:

@Html.RadioButton("radio-name","false", new { id="test", required=Model.BooleanValue})

and

<input type="radio" name="radio-name" id="radio-name-no" value="false" class="radio" @if (!Model.BooleanValue) { <text>required</text> } disabled="@Model.BooleanValue" />

But the output is this:

<input id="test" name="radio-name" required="False" value="false" type="radio">

and

<input name="radio-name" id="radio-name-no" value="false" class="radio" disabled="True" type="radio">

MVC4 should render the boolean attributes as per HTML5 specs, so why it's outputting disabled="True" (or False) instead of disabled="disabled" or disabled (or nothing at all if the BooleanValue property is false)?

Because your telling it to by using disabled="@Model.BooleanValue" - but what are you wanting to do here. disabled="true" and disabled="false" (or disabled="disabled" or just disabled) are all identical - its the presence of the attribute which determines if its disabled or not. You need to conditionally add the attribute. — user3559349
– user3559349, Commented Nov 15, 2017 at 9:21
Razor2 should, if the HTML5 attribute is a boolean attribute, automatically render it as disabled (or disabled=disabled) instead of disabled="True", and don't render it at all if the Model's property is false or null. It seems like in my case it does a ToString() and directly assigning the boolean's value to the attribute. — user1527576
– user1527576, Commented Nov 15, 2017 at 9:25
Not in the first case (by adding htmlAttributes using new { ... } (conditional attributes do not apply then). And the 2nd case does work and will generate disabled="disabled" if the property is true` and omit it if false - I can only assume your not using Razor2 — user3559349
– user3559349, Commented Nov 15, 2017 at 9:34
Thanks for the clarification for the first case.For the second one I've double checked the Razor dll version and it's 2.0.20710.0 — user1527576
– user1527576, Commented Nov 15, 2017 at 9:40
Works just fine for me in MVC-5 (cant test in MVC-4 at the moment) — user3559349
– user3559349, Commented Nov 15, 2017 at 9:44

KyleMit · Accepted Answer · 2022-10-04 20:45:51Z

3

You can include conditionally rendered attributes like this:

<input 
    type="radio"
    required="@(!Model.BooleanValue)"
    disabled="@Model.BooleanValue" />

The solution was pretty strange. While doing some tests, I put an @if in the HTML input tag. This if was used to show the required attribute. After this @if, I put the disabled="@Model.BooleanValue" attribute.

It seems that this order disrupted the expected behaviour. Placing the disabled attribute before the @if solved the problem (later I have deleted the @if and converted it to required="@(!Model.BooleanValue)").

edited Oct 4, 2022 at 20:45

KyleMit♦

31.4k74 gold badges517 silver badges712 bronze badges

answered Nov 15, 2017 at 11:04

user1527576

3063 silver badges16 bronze badges

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

Collectives™ on Stack Overflow

MVC4: HTML5 boolean attributes rendered with True/False value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related