[英]When using .net MVC RadioButtonFor(), how do you group so only one selection can be made?
这个让我难过,我有一个强类型的视图,有这个循环生成radiobuttons:
<% foreach (QuestionAnswer qa in Model.QuestionAnswers)
{ %>
<%= Html.RadioButtonFor(model => model.QuestionAnswers[(int)qa.QuestionID - 1].AnswerValue, "Checked" ) %>
<%= Html.Encode(qa.OptionValue) %>
<% } %>
它渲染得很好,但由于名称不一样,你可以选择1个以上的radiobutton。 如何对它们进行分组,这样才能选择1个单选按钮?
任何帮助,将不胜感激!
Html.RadioButtonFor()的第一个参数应该是您正在使用的属性名称,第二个参数应该是该特定单选按钮的值。 然后它们将具有相同的名称属性值,并且当/如果它与属性值匹配时,帮助器将选择给定的单选按钮。
例:
<div class="editor-field">
<%= Html.RadioButtonFor(m => m.Gender, "M" ) %> Male
<%= Html.RadioButtonFor(m => m.Gender, "F" ) %> Female
</div>
这是一个更具体的例子:
我做了一个名为“DeleteMeQuestion”的快速MVC项目(DeleteMe前缀,所以我知道我可以在忘记之后删除它)。
我做了以下模型:
namespace DeleteMeQuestion.Models
{
public class QuizModel
{
public int ParentQuestionId { get; set; }
public int QuestionId { get; set; }
public string QuestionDisplayText { get; set; }
public List<Response> Responses { get; set; }
[Range(1,999, ErrorMessage = "Please choose a response.")]
public int SelectedResponse { get; set; }
}
public class Response
{
public int ResponseId { get; set; }
public int ChildQuestionId { get; set; }
public string ResponseDisplayText { get; set; }
}
}
模型中有一个简单的范围验证器,只是为了好玩。 接下来,我制作了以下控制器:
namespace DeleteMeQuestion.Controllers
{
[HandleError]
public class HomeController : Controller
{
public ActionResult Index(int? id)
{
// TODO: get question to show based on method parameter
var model = GetModel(id);
return View(model);
}
[HttpPost]
public ActionResult Index(int? id, QuizModel model)
{
if (!ModelState.IsValid)
{
var freshModel = GetModel(id);
return View(freshModel);
}
// TODO: save selected answer in database
// TODO: get next question based on selected answer (hard coded to 999 for now)
var nextQuestionId = 999;
return RedirectToAction("Index", "Home", new {id = nextQuestionId});
}
private QuizModel GetModel(int? questionId)
{
// just a stub, in lieu of a database
var model = new QuizModel
{
QuestionDisplayText = questionId.HasValue ? "And so on..." : "What is your favorite color?",
QuestionId = 1,
Responses = new List<Response>
{
new Response
{
ChildQuestionId = 2,
ResponseId = 1,
ResponseDisplayText = "Red"
},
new Response
{
ChildQuestionId = 3,
ResponseId = 2,
ResponseDisplayText = "Blue"
},
new Response
{
ChildQuestionId = 4,
ResponseId = 3,
ResponseDisplayText = "Green"
},
}
};
return model;
}
}
}
最后,我做了以下使用该模型的视图:
<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<DeleteMeQuestion.Models.QuizModel>" %>
<asp:Content ContentPlaceHolderID="TitleContent" runat="server">
Home Page
</asp:Content>
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<% using (Html.BeginForm()) { %>
<div>
<h1><%: Model.QuestionDisplayText %></h1>
<div>
<ul>
<% foreach (var item in Model.Responses) { %>
<li>
<%= Html.RadioButtonFor(m => m.SelectedResponse, item.ResponseId, new {id="Response" + item.ResponseId}) %>
<label for="Response<%: item.ResponseId %>"><%: item.ResponseDisplayText %></label>
</li>
<% } %>
</ul>
<%= Html.ValidationMessageFor(m => m.SelectedResponse) %>
</div>
<input type="submit" value="Submit" />
<% } %>
</asp:Content>
据我了解您的背景,您可以获得可用答案列表的问题。 每个答案都将决定下一个问题。 希望从我的模型和TODO评论中有意义。
这为您提供了具有相同名称属性但具有不同ID属性的单选按钮。
就我而言,我有一组需要在一个组中的单选按钮。 我刚刚在模型中包含了一个“Selected”属性。 然后,在循环中输出radiobuttons只是做...
@Html.RadioButtonFor(m => Model.Selected, Model.Categories[i].Title)
这样,所有单选按钮的名称都相同。 发布表单时,'Selected'属性等于类别标题(或id或其他),这可用于更新相关单选按钮上的绑定,如下所示...
model.Categories.Find(m => m.Title.Equals(model.Selected)).Selected = true;
可能不是最好的方式,但确实有效。
在name属性不同的情况下,最容易通过JQuery控制无线电组。 选择选项时,使用JQuery取消选择其他选项。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.