CODEWITHSUNDEEP
jquerytwitter-bootstraprazor
user1651888
user1651888

Reputation: 463

using bootstrap and razor for radio buttons

I have a razor page where i view the radio button depending on value of model. It always gives me the checked button as the last option"under 30". Why does it always gives me the last radio button as checked?

If i use console.log it prints correct value which is "under 20". What is incorrect value. 

<div class="radio disabled">
       <label><input type="radio" checked="@M.Type" value="under 10" disabled="disabled" name="Age" /> Age under 10</label>
       <br>
       <label><input type="radio" checked="@M.Type" value="under 20" disabled="disabled" name="Age" /> Age under 20</label>
       <br>
       <label><input type="radio" checked="@M.Type" value="under 30" disabled="disabled" name="Age" /> Age under 30</label>
       </div>



<script>
console.log("@M.Type");
</script>

Upvotes: 0

Views: 1195

Answers (1)

Steve Greene
Steve Greene

Reputation: 12304

All your inputs have the checked attribute which should only be specified for the selected item so when it gets to the last item in your list that is the one checked. If you are using razor, I would recommend the helpers:

@Html.RadioButtonFor(m => m.Type, "under 10")
@Html.RadioButtonFor(m => m.Type, "under 20")
@Html.RadioButtonFor(m => m.Type, "under 30")

Otherwise if you stick with html you could use

@if (Model.Type == "under 10")
    <label><input type="radio" checked="checked" value="under 10" disabled="disabled" name="Age" /> Age under 10</label>
else
    <label><input type="radio" value="under 10" disabled="disabled" name="Age" /> Age under 10</label>

Actually, a switch statement would make more sense.

Upvotes: 1

Related Questions