开发者

Why does the selected radio button at runtime differ from my programmatic setup?

I have data model classes as follows:

public class QuizItem
    {
        public int QuizItemId { get; set; }
        public string Question { get; set; }
        public IEnumerable<Choice> Choices { get; set; }
    }

and

 public class Choice
    {
        public int ChoiceId { get; set; }
        public string开发者_JAVA技巧 Description { get; set; }
        public bool IsCorrect { get; set; }
    }

I made a setup in a controller action as follows:

public class HomeController : Controller
    {
        public ActionResult Index()
        {
            IEnumerable<Choice> choices = new Choice[]
            {
                new Choice{ChoiceId=1,Description="Black",IsCorrect=true},
                new Choice{ChoiceId=2,Description="Red",IsCorrect=false},
                new Choice{ChoiceId=3,Description="Yellow",IsCorrect=false}
            };

            QuizItem qi = new QuizItem { QuizItemId = 1, 
                Question = "What color is your hair?",
                Choices = choices };

            return View(qi);
        }

The last, here is my view:

@model MvcApplication1.Models.QuizItem
@{
    ViewBag.Title = "Index";
}
<h2>
    Index</h2>
<fieldset>
    <legend>QuizItem</legend>
    <div class="display-label">
        Question</div>
    <div class="display-field">@Model.Question</div>

        @foreach (var x in Model.Choices)
        {
            <text>@Html.RadioButtonFor(y => Model.QuizItemId, x.Description, new { @checked = x.IsCorrect })
                @x.Description<br /></text>
        }

</fieldset>

At runtime, the selected option should be Black. But Yellow gets selected. How to resolve this issue?

Why does the selected radio button at runtime differ from my programmatic setup?


You need to set the @checked attribute to the string "checked", not true/false.

new { @checked = x.IsCorrect ? "checked" : string.Empty }


JK is right at the same time he is wrong.

The checked attribute should really be used with the "checked" value, the correct and valid W3C html markup for a checked radio is:

<input type="radion" name="something" value="1" checked="checked">

But, when you output this:

<input type="radion" name="something" value="1" checked="">

The browser still renders it as a checked radio. Your own solution is the best so far.


I find that the radio button helper is too much trouble to get to work correctly.

You are best off with writing the raw HTML for the the radio buttons yourself. This is especially true when you have multiple options:

<input type="radio" id="ques1_choice1" name="quizQuestion1" value="1" @(x.IsCorrect ? "checked=\"checked\"" : null) />
<input type="radio" id="ques1_choice2" name="quizQuestion1" value="2" @(x.IsCorrect ? "checked=\"checked\"" : null) />


I found the solution as follows:

<fieldset>
    <legend>@Model.Question</legend>
    @foreach (var x in Model.Choices)
    {

        <text>@Html.RadioButton(Model.QuizItemId.ToString(), x.Description, x.IsCorrect)
        @x.Description<br /></text>

    }
</fieldset>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜