0

我正在使用 C#、MVC4 和 jQuery。给我的要求是我需要能够将记录添加到数据库中，该数据库可以转换为视图中的可编辑字段。

该视图具有选项卡、组、行和项，需要根据数据库中的内容进行填充。我已经能够使用包含“选项卡”列表的视图模型来实现我想要的；每个选项卡都包含一个“组”列表；每个组包含一个“行”列表，每个行包含一个“项目”列表。

对我来说最终发生的事情是我需要重复很多对编辑器完全相同的代码。这是我想要避免的。

所以在我看来，我有类似的东西：

    @for (int tabIndex = 0; Model.Tabs != null && tabIndex < Model.Tabs.Count; tabIndex++)
    {
        <div id="tab-@Model.Tabs[tabIndex].TabID" class="tab-content">
        @for (int groupIndex = 0; Model.Tabs[tabIndex].Groups != null && groupIndex < Model.Tabs[tabIndex].Groups.Count; groupIndex++)
        {
            <legend>@Model.Tabs[tabIndex].Groups[groupIndex].Name</legend>
            //This is the part that is not working but I would like to
            AddEditorsForGroup(tabIndex, groupIndex);
...
...

然后我也有这个观点：

@{
    public void AddEditorsForGroup(int TabIndex, int GroupIndex)
    {
        for (int lineIndex = 0; Model.Tabs[TabIndex].Groups[GroupIndex].Lines != null && lineIndex < Model.Tabs[TabIndex].Groups[GroupIndex].Lines.Count; lineIndex++)
        {
            for (int itemIndex = 0; Model.Tabs[TabIndex].Groups[GroupIndex].Lines[lineIndex].Items != null && itemIndex < Model.Tabs[TabIndex].Groups[GroupIndex].Lines[lineIndex].Items.Count; itemIndex++)
            {
                AddLabelAndEditor(TabIndex, GroupIndex, lineIndex, itemIndex);
            }
        }
    }
    public void AddLabelAndEditor(int TabIndex, int GroupIndex, int LineIndex, int ItemIndex)
    {
            <div class="_20">
                    <p>
        switch (Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].DisplayTypeEdit.ToLower().Replace(" ", string.Empty))
        {
            case "checkbox":
                Html.LabelFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueBoolean, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].Name);
                Html.CheckBoxFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueBoolean);
                break;
            case "dropdownlist":
                Html.LabelFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].Name);
                Html.DropDownListFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueSelectList);
                break;
            case "multiselectlist":
                Html.LabelFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].Name);
                Html.DropDownListFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueMultiSelectList);
                break;
            case "radiobutton":
                Html.RadioButtonFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString);
                break;
            case "textarea":
                Html.LabelFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].Name);
                Html.TextAreaFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString);
                break;
            default:
                Html.LabelFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString, Model.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].Name);
                Html.TextBoxFor(vm => vm.Tabs[TabIndex].Groups[GroupIndex].Lines[LineIndex].Items[ItemIndex].ValueString);
                break;
        }
                </p>
            </div>
    }   
}

如果我AddLabelAndEditor在视图的几个部分重复包含的代码，它可以工作，但它是很多代码重复。

我的 ViewModel 的相关部分：

public List<Tab> Tabs { get; set; }

public class Tab
{
    public string Name { get; set; }
    public List<Group> Groups { get; set; }
}
public class Group
{
    public string Name { get; set; }
    public List<Line> Lines { get; set; }
}
public class Line
{
    public string Name { get; set; }
    public List<Item> Items { get; set; }
}
public class Item
{
    public string Name { get; set; }
    public string Description { get; set; }
    public string DataType { get; set; }
    public string DataDefaultValue { get; set; }
    public string DisplayTypeEdit { get; set; }

    public string ValueString { get; set; }
    public bool ValueBoolean { get; set; }
    public DateTime ValeDateTime { get; set; }
    public decimal ValueDecimal { get; set; }
    public int ValueInt { get; set; }
    public MultiSelectList ValueMultiSelectList { get; set; }
    public SelectList ValueSelectList { get; set; }
}

有什么想法、想法、建议吗？谢谢

4

2 回答 2

1

您可以为每种类型创建EditFor 模板：

/Views/Shared/EditorTemplates/Tab.cshtml：

@model Tab

<div>
  // Specific Tab Html
  @Model.Name
  @foreach (var group in Model.Groups)
  {
    Html.Editfor(m => group)
  }
</div>

/Views/Shared/EditorTemplates/Group.cshtml

//Group html etc

您可以将它们链接起来并在任何地方重复使用它们：

@model viewModel

<div>
  @foreach (var tab in Model.Tabs)
  {
    Html.Editfor(m => tab)
  }
</div>

看来您正在做的是专门为模板设计的 EditFor/Display。

于 2013-07-22T05:57:31.863 回答
1

所以，这就是你可以做的。在您的主视图中，您将拥有：

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

然后，您需要创建以下部分视图，并将它们放在 Views/Shared/EditorTemplates 下：

选项卡.cshtml：

@model YourApp.ViewModels.Tab

<div class="Tab"> @* Or however you want to represent each Tab... *@
    @Html.EditorFor(model => model.Groups)
</div>

组.cshtml：

@model YourApp.ViewModels.Group

<div class="Group"> @* Or however you want to represent each Group... *@
    @Html.EditorFor(model => model.Lines)
</div>

行.cshtml：

@model YourApp.ViewModels.Line

<div class="Line"> @* Or however you want to represent each Line... *@
    @Html.EditorFor(model => model.Items)
</div>

项目.cshtml：

@model YourApp.ViewModels.Item

<div class="_20">
  @Html.Label(Model.Name)
  @switch (Model.DisplayTypeEdit.ToLower().Replace(" ", string.Empty))
  {
      case "checkbox":
          @Html.CheckBoxFor(model => model.ValueBoolean)
          break;
      case "dropdownlist":
          @Html.DropDownListFor(model => model.ValueString, Model.ValueSelectList)
          break;
      case "multiselectlist":
          @Html.DropDownListFor(model => model.ValueString, Model.ValueMultiSelectList)
          break;
      case "radiobutton":
          @Html.RadioButtonFor(model => model.ValueString, Model.ValueString)
          break;
      case "textarea":
          @Html.TextAreaFor(model => model.ValueString)
          break;
      default:
          @Html.TextBoxFor(model => model.ValueString)
          break;
  }
</div>
于 2013-07-23T17:38:26.377 回答