设计编辑器模板

Question

目前，我有一个编辑器模板页面，其中包含以下代码：

@model Comics.Models.LocalComicCategoriesModel

@Html.LabelFor(x => x.Title, Model.Title)
@Html.CheckBoxFor(x => x.isChecked)
@Html.HiddenFor(x => x.Id)

我从不同的页面中调用：

@Html.EditorFor(x => x.Categories)

当模板被输出时，我只得到一个笨拙的html，它没有任何设计，比如：

​

我想要的是：

​

我可以通过这样做来实现这一点：

@model IEnumerable<Comics.Models.LocalComicCategoriesModel>

<div id="checkbox-list">
    @for (int iterator = 0; iterator < Model.Count(); iterator++)
    {
        if ((iterator % 6) == 0 || iterator == 0)
        {
            @Html.Raw("<div class='checkboxes_cont' style='float: left;'>");
        }


        string catTitle = Model.ElementAt(iterator).Title;
        bool catChecked = Model.ElementAt(iterator).isChecked;
        string catId = Model.ElementAt(iterator).Id.ToString();

        <div class="itemtest" style="width: 100px;">
            <input id="Categories_@iterator.ToString()__isChecked" name="Categories[@iterator.ToString()].isChecked" type="checkbox" value="@catChecked.ToString()" data-title="@catTitle" @if (catChecked) { Write("checked=checked"); }>
            <label for="Categories_@iterator.ToString()__Title">@catTitle</label>
            <input name="Categories[@iterator.ToString()].isChecked" type="hidden" value="false">
            <input data-val="true" data-val-number="The field Id must be a number." id="Categories_@iterator.ToString()__Id" name="Categories[@iterator.ToString()].Id" type="hidden" value="@catId">
        </div>

        if ((iterator % 6) == 5 || iterator == Model.Count() - 1)
        {
            @Html.Raw("</div>")
        }
    }
</div>

但是，当我将数据发回控制器时，新复选框剂量的值将被发回。我想知道是否可以通过编辑器模板来完成这个任务。

Answer 1

问题在于，您试图用HTML来解决显示问题，这显然不是HTML的目的；这是CSS的领域。将样式应用到样式表中的复选框中，让HTML就可以了。