ASP.NET MVC编辑器模板;用于显示的列的定位

时间:2012-12-11 14:52:05

标签: asp.net-mvc-3

我在ASP.net MVC项目中使用了一个编辑器模板。编辑器模板由隐藏字段,复选框,标签和文本框组成。

这是编辑器模板:

@model Models.Domain.myObject

<p>
    @Html.HiddenFor(x => x.Id) 

    @Html.DisplayFor(x => x.Name)

    @Html.CheckBoxFor(x => x.Selected)
    @Html.TextBoxFor(x => x.DefaultCount, new { disabled = "disabled"})

</p>

以下是我在视图中使用此模板的内容:

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

有时我可能有3个myObjects,有时候我有10个.MVC可以很好地为我设置所有这些,只有一个例外。

我希望名称彼此正确对齐,我希望复选框彼此左对齐以用于外观目的。

我该怎么做?

现在我得到这样的东西:

displaydisplay   checkbox textbox
display  checkbox textbox
displaydisplaydisplay checkbox text box 

我想要的是(希望你能看到对齐方式):

       displaydisplay   checkbox textbox
              display   checkbox textbox
displaydisplaydisplay   checkbox textbox 

1 个答案:

答案 0 :(得分:0)

该解决方案基于html / css。 您可以使用“div”或“table”。

使用表格选项的示例:

查看“母亲”

<table>
        @Html.EditorFor(model => model.myObject)
</table>

查看“儿童”

<tr>
    <td style="width: 200px; text-align: right;">
        @Html.HiddenFor(x => x.Id)
        @Html.DisplayFor(x => x.Name)
    </td>
    <td>
        @Html.CheckBoxFor(x => x.Selected)
        @Html.TextBoxFor(x => x.DefaultCount, new { disabled = "disabled"})
    </td>
</tr>

注意:正如我所说,你可以使用Div来做同样的视觉效果,你可以添加“css类”以获得更清晰的代码。