标签: mvc-editor-templates

我在ASP.net MVC中使用编辑器模板.我应该将表单放在编辑器模板内还是模板外？

例:

内

〜/查看/产品/ Create.cshtml

@Html.EditorForModel()   

〜/查看/产品/ EditorTemplates/CreateProduct.cshtml

@using(Html.BeginForm())
{
     @Html.EditorFor(model => model.Name)

     <input type="submit" value="Save" />
}

外

〜/查看/产品/ Create.cshtml

@using(Html.BeginForm())
{
    @Html.EditorForModel()

    <input type="submit" value="Save" />
}

〜/查看/产品/ EditorTemplates/CreateProduct.cshtml

@Html.EditorFor(model => model.Name)

我在ASP.NET MVC应用程序中使用了许多编辑器模板来处理不同的数据类型(字符串,DateTime等).例如,以下是我用于字符串的内容:

<div class="editor-label">
     @Html.Label("")
</div>
<div class="editor-field">
    @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = "text", placeholder = ViewData.ModelMetadata.Watermark })
    @Html.ValidationMessage("")
</div>

我想在我的视图中使用EditorForModel,但是当我这样做时,似乎为每个属性添加了它自己的标签,导致重复的标签(因为我的字符串编辑器模板中有一个标签).有什么办法,除了从我的字符串editortemplate(在这个例子中)删除标签,我可以告诉editorformodel不要插入标签？

我想在我的模型中将一组文本框(小时,分钟和秒)绑定到TimeSpan.我不想在我的模型中添加小时,分钟和秒,我宁愿不将它们作为参数传递给action方法.

我发现了一些关于使用编辑器模板的讨论,但找不到一个好的例子.

下面正确地为添加到控制器中实例化的列表中的每个项目呈现标签和文本框.

我需要的是标签显示"FavouriteThingID"(即1,2,3,4,5)的值而不是文字"FavouriteThingID".

有任何想法吗？

视图模型

public class FavouriteThingViewModel
{
    public int FavouriteThingID { get; set; }
    public string FavouriteThingName { get; set; }
}

编辑模板

@model _5fave.Models.FavouriteThingViewModel

<div class="control-group">
    @Html.LabelFor(m => m.FavouriteThingID, new { @class = "control-label" })
    <div class="controls">
        @Html.TextBoxFor(m => m.FavouriteThingName)
        @Html.ValidationMessageFor(m => m.FavouriteThingName, null, new { @class = "help-inline" })
    </div>
</div>

调节器

var favouriteThings = new List<FavouriteThingViewModel>();
    favouriteThings.Add(new FavouriteThingViewModel { FavouriteThingID = 1, FavouriteThingName = "Raindrops on roses" });
    favouriteThings.Add(new FavouriteThingViewModel { FavouriteThingID = 2, FavouriteThingName = …

我正在使用引导程序模板，其复选框模板如下所示：

<div class="checkbox">
    <label>
        <input type="checkbox" class="checkbox style-1" checked="checked">
        <span>Checkbox 1</span>
    </label>
</div>

我需要一个布尔值的MVC EditorTemplate才能使用此模板。MVC CheckBoxFor默认模板不同于此模板，它具有另一个隐藏的输入字段来保存数据，并且没有跨度来显示复选框图标（它使用css无法样式化的默认图标）。

MVC CheckBox对于默认模板：

<input checked="checked" data-val="true" data-val-required="required." id="IsActive" 
       name="IsActive" type="checkbox" value="true">
<input name="IsActive" type="hidden" value="false">

我尝试了许多方法来完成此操作，但均未成功。例如，如果我使用如下所示的条件模板，则提交后它不会返回值。

我的布尔编辑器模板：

@model Boolean?
<div class="checkbox">
    <label>
        @if (Model.Value)
        {
            <input id="@ViewData.TemplateInfo.GetFullHtmlFieldId("")" name="@ViewData.TemplateInfo.GetFullHtmlFieldId("")"
                   type="checkbox" class="checkbox style-1" checked="checked" value="true" />
        }
        else
        {
            <input id="@ViewData.TemplateInfo.GetFullHtmlFieldId("")" name="@ViewData.TemplateInfo.GetFullHtmlFieldId("")"
                   type="checkbox" class="checkbox style-1" value="false" />
        }
        <span>@Html.LabelFor(m => m)</span>
    </label>
</div>

有人可以帮忙吗？

更新：

部分css代码将相关事件关联到复选框图标：

label input[type=checkbox].checkbox + span:before {
    font-family: FontAwesome;
    font-size: 12px;
    border-radius: 0; …

我有这个代码来设置我的选择列表的默认值:

public ActionResult Register()
{
    IList<Country> countryList = _countryRepository.GetAllCountry();

    var registerViewModel = new RegisterViewModel
    {
        CountryId = 52,
        CountryList = new SelectList(countryList, "CountryId", "CountryName", "Select Country")
    };

    return View(registerViewModel);
}

我在我的观点上有这个,这很有效,将选定的国家/地区值设置为52:

<%: Html.DropDownListFor(model => model.CountryId, Model.CountryList ,"Select Country") %>

但是,当我为此创建编辑器模板时,未选择国家/地区的默认值

所以,我将当前视图更改为:

 <%: Html.EditorFor(model => model.CountryId,new { countries = Model.CountryList}) %>

然后我像这样创建我的编辑器模板:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.Int64?>" %>
<%= Html.DropDownList(
        String.Empty /* */, 
        (SelectList)ViewData["countries"], 
        "Select Country"
    )
%>

我正在编写一个编辑器模板,用于输入由三个字段组成的日期和时间.

• 带有jQuery UI datepicker的文本框.
• 用于输入时间的文本框.
• 通过javascript使用完整的日期和时间字符串更新的隐藏输入.

我们的想法是为用户显示日期和时间的单独字段,而只有一个字段绑定到模型.每当更改显示的字段时,隐藏字段将通过JavaScript更新.

@model System.DateTime?
<span class="datetime-editor">
<input class="datepicker" value="@(Model.HasValue ? 
  Model.Value.Date.ToString() : string.Empty)" readonly="readonly"/>
<input class="time" value="@(Model.HasValue ? 
  Model.Value.TimeOfDay.ToString() : string.Empty)"/>
@Html.HiddenFor(d => d)</span>

用于设置日期选择器并将值复制到隐藏字段的JavaScript.

$(".datepicker").datepicker();
$(".datetime-editor").find("input").change(function () {
    var date = $(this).parent().find(".datepicker").val();
    var time = parseTime($(this).parent().find(".time").val());
    if (date != "" && time != null) {
        $(this).siblings(".datetime-result").val(date + " " + time);
    }
    else {
        $(this).siblings(".datetime-result").val("");
    }
});

我的问题是验证属性.它们都存在于隐藏的输入标记中:

<input name="StartDateTime" id="StartDateTime" type="hidden" 
  data-val-required="Start date and time are required" data-val="true" value=""/>

我想以某种方式获取生成的data-val*属性,并将它们添加到可见输入中.通过ViewData.ModelMetaData …

我正在尝试创建一个编辑器模板,它将为传递的选择列表中的每个值创建一个"引导样式"单选按钮(就像Html.DropDownFor创建下拉列表的方法一样)

所以我在我看来有这个电话:

@Html.EditorFor(model => model.FaultTypeID,"RadioButtonList", 
        new SelectList(Model.AllowdeFaultTypes, "FaultTypeID", "FaultTypeName"))

现在是RadioButtonList的模板:

@foreach (var item in ViewData["Items"] as SelectList)
{
    <a>@item.Text</a> <b>@item.Value</b>
}

但是转换失败了,我得到了一个NullReferanceExeption.通过反射,我看到ViewData["Items"]值是类型System.Collections.Generic.List<CamelotFaultManagement.DAL.FaultType>

问题是我真的不想将RadioButtonList编辑器模板与CamelotFaultManagement.DAL.FaultType类紧密结合,只是没有任何意义这样做.我想要一个通用的编辑器模板.

这是令人费解的.为简单起见,想象一下具有.Employees可枚举属性的Company实体.我已经在其他地方看到,使EditorTemplates能够合理地呈现可枚举的技巧是使用这样的语法:

在Index.cshtml中:

@Html.EditorFor(company => company.Employees, "EmployeeEditorTemplate") 

EmployeeEditorTemplate.cshtml需要一名员工:

@model MyNamespace.Models.Employee
//...
@Html.EditorFor(x => x.FullName)
// ...etc.

像这样的帖子:Viewmodels列表在行动中是空的 ...表明模型绑定器足够聪明,可以找出绑定并动态索引可枚举.我得到了不同的结果(正如我所期望的那样,如果模型绑定器不应该是如此mageriffic):

The model item passed into the dictionary is of type 
System.Collections.Generic.List`1[MyNamespace.Models.Employee]', 
but this dictionary requires a model item of type 
'MyNamespace.Models.Employee'.

自己枚举它会使集合很好,但是为每一行的控件发出相同的id(当然,这不是最佳的,但它告诉我EditorTemplate在功能上是正确的):

@foreach (var item in Model.Employees)
{
    @Html.EditorFor(x => item, "EmployeeEditorTemplate")
}

此构造也无法发布company.Employees集合回到我的其他控制器操作.

有关实现以下目标所需要的任何想法？

• 使用列表中的每个实例呈现具有唯一ID的子集合
• 使用模型将子集合发回

我不在乎我是否必须自己列举它,也不管它是在EditorTemplate内部还是外部; 我刚刚看到它说这是不必要的,如果你让它处理事情,MVC会更好.谢谢.

下面是一个EditorTemplate,它使用EditorFor帮助器呈现Bootstrap datetimepicker,我看到的问题是脚本部分.它适用于DateTimePicker每个视图一个- 但由于我使用类选择器,每当我DateTimePicker在每个视图中使用2个或更多时,它会呈现重复的<script>部分,使DOM在TextBox调用日历时感到困惑.我在这里错过了什么？

   @model DateTime?
   <div class='input-group date datePicker'>
      <span class="input-group-sm">
         @Html.TextBox("", Model.HasValue ? Model.Value.ToString("d") : String.Empty)
      </span>
   </div>
   <script type="text/javascript">
       $(function() {
       $('.datePicker').datetimepicker({
           pickTime: false
       });
   });
   </script>