【问题标题】:How do I use Html.EditorFor to render radio buttons in MVC3?如何使用 Html.EditorFor 在 MVC3 中呈现单选按钮?
【发布时间】:2011-08-17 19:36:05
【问题描述】:

这是我的模型:

[Required]
[Display(Name = "I'm a:")]
public bool Sex { get; set; }

还有我的编辑器模板:

<div>
    @Html.LabelFor(model => model.RegisterModel.Sex)
    @Html.EditorFor(model => model.RegisterModel.Sex)
</div>

但是,这会呈现为以下内容:

<div>
    <label for="RegisterModel_Sex">Soy:</label>
    <input class="check-box" data-val="true" data-val-required="The Soy: field is required." id="RegisterModel_Sex" name="RegisterModel.Sex" type="checkbox" value="true" /><input name="RegisterModel.Sex" type="hidden" value="false" />
</div>

如何为男性和女性呈现一些漂亮的单选按钮?我的模型必须具有什么数据类型?


编辑:

这是我的新更新代码:

//Model:
    [Required]
    [Display(Name = "Soy:")]
    public Gender Sex { get; set; }
}

public enum Gender
{
    Male = 1,
    Female = 2
}

//Viewmodel:

<fieldset>
    <legend>Informacion Personal</legend>
    <div>
        @Html.LabelFor(model => model.RegisterModel.Nombre)
        @Html.EditorFor(model => model.RegisterModel.Nombre)
    </div>

    <div>
        @Html.LabelFor(model => model.RegisterModel.Apellido)
        @Html.EditorFor(model => model.RegisterModel.Apellido)
    </div>

    <div>
        @Html.LabelFor(model => model.RegisterModel.Sex)
        @Html.EditorFor(model => model.RegisterModel.Sex)
    </div>

    <div>
        @Html.LabelFor(model => model.RegisterModel.Carnet)
        @Html.EditorFor(model => model.RegisterModel.Carnet)
    </div>    
</fieldset>


//EditorTemplate:

@model GoldRemate.WebUI.Models.Gender

@{
    ViewBag.Title = "Gender";
}

<input type="radio" name="Sex" value="@Model" />

当我运行这个时,我得到这个错误:

传入字典的模型项为空,但是这个字典 需要类型的非空模型项 'GoldRemate.WebUI.Models.Gender'。

这是什么原因造成的?如何在我的表单中显示我的枚举值?

【问题讨论】:

  • 您是否按照命名格式创建了编辑器模板? AKA,您是否创建了一个 ~/Views/Shared/EditorTemplates/Sex.ascx 文件,其中包含您想要的渲染方式?
  • 不,我没有。我是不是该?它应该与我的财产完全一样吗?
  • 您的模型有效地在问“性别:是或否?”你得到一个复选框,因为布尔字段默认呈现为复选框。
  • 抱歉,我看错了您的物业名称。编辑器模板应与您的数据类型相对应;在这种情况下布尔。我建议将其更改为Enum,然后为该枚举制作一个编辑器模板。
  • @Tejs:您介意向我展示一个示例,说明如何设置包含带有注释的枚举的模型吗?作为答案,我会投赞成票。

标签: c# asp.net-mvc-3 model


【解决方案1】:

像这样创建一个枚举:

 public enum Gender
 {
     Male = 1,
     Female = 2
 }

我会稍微改变你的模型:

 public Gender Sex { get; set; }

然后在你看来你会这样做:

 Html.EditorFor(x => x.RegisterModel.Sex);

那么你会在这里有一个EditorTemplate:

 ~/Views/Shared/EditorTemplates/Gender.cshtml

会有这样的内容:

@model EditorTemplate.Models.Gender // switch to your namespace

@Html.LabelFor(x => x, "Male")
@if(Model == EditorTemplate.Models.Gender.Male)
{
    @Html.RadioButtonFor(x => x, (int)EditorTemplate.Models.Gender.Male, new { @checked = "checked" });
}
else
{
    @Html.RadioButtonFor(x => x, (int)EditorTemplate.Models.Gender.Male);
}

@Html.LabelFor(x => x, "Female")
@if(Model == EditorTemplate.Models.Gender.Female)
{
    @Html.RadioButtonFor(x => x, (int)EditorTemplate.Models.Gender.Female, new { @checked = "checked" });
}
else
{
    @Html.RadioButtonFor(x => x, (int)EditorTemplate.Models.Gender.Female);
}

所以我在 Visual Studio 中对此进行了建模,并按预期工作。试试看。

【讨论】:

  • 好的,所以我已经对您进行了更改,但我仍然卡在编辑器位上。在我的编辑器模板中,我需要编写什么 HTML 才能将枚举中的每个枚举显示为单选按钮?我已经尝试过了,但它不起作用:&lt;input type="radio" name="Sex" value="@Model" /&gt;
  • 请查看我的新编辑,了解我尝试过的相关事情以及它们如何不起作用。
  • 当我尝试这个时,我得到了无效的 HTML 重复 ID。
  • 我尝试了这种方法,但是 VS 脚手架正在生成 @Html.EnumDropDownListFor... 编辑刚刚注意到这是 2015 年
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2013-05-29
  • 2012-05-01
  • 1970-01-01
  • 1970-01-01
  • 2012-07-12
  • 2012-01-23
  • 1970-01-01
相关资源
最近更新 更多