如何替換ASP.Net的MVC4視圖以構建div而不是表

Question

這是我剛剛寫的一個問題，我能夠找到答案，所以我沒有刪除問題，而是繼續發布該問題，因為我沒有找到具體回答具體問題的答案。

Answer 1

1.）轉到：C：\\ Program Files（x86）\\ Microsoft Visual Studio 11.0 \\ Common7 \\ IDE \\ ItemTemplates \\ CSharp \\ Web \\ MVC 4 \\ CodeTemplates \\ AddView \\ CSHTML

2.）將該文件夾復制到您的解決方案中，並將其放入名為“ CodeTemplates”的文件夾中

3.）刪除除List.tt之外的每個文件（除非您正在使用它們，否則該文件夾中將沒有文件。完成此操作后，您可以為該文件夾中的每個其他文件重復該過程。）

4.）在List.tt文件的屬性中進行更改

Build Action: NONE
Browse To Url: BLANK
Copy to Output Dir: DO NOT COPY

5.）將文件重命名為List_Div，然后編輯文件以按需要工作。 然后，當您轉到腳手架時，List_Div將是一個新選項。 您必須對要使用此功能的每個項目都執行此操作。 但是，當我啟動一個新項目時，我只是將目錄復制到每個項目中。 我有一個專門用於Bootstrap項目，基金會項目等的Views文件夾。

我將為您提供一個有關我的Foundation t4模板的示例： List_F5.tt文件的樣子，我僅向您顯示重要更改的行（大約49至128行：

    <!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title><#= mvcHost.ViewName #></title>
</head>
<body>
<#
    PushIndent("    ");
}
#>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
<div class="row">
    <div class="large-12 columns">
<#
List<ModelProperty> properties = GetModelProperties(mvcHost.ViewDataType);
foreach (ModelProperty property in properties) {
    if (!property.IsPrimaryKey && property.Scaffold) {
#>
        <div class="medium-1 columns">
            @Html.DisplayNameFor(model => model.<#= property.ValueExpression #>)
        </div>
<#
    }
}
#>
        <div class="medium-3 columns"></div>
    </div>

@foreach (var item in Model) {
    <div class="medium-12 columns">
<#
foreach (ModelProperty property in properties) {
    if (!property.IsPrimaryKey && property.Scaffold) {
#>
        <div class="medium-1 columns">
            @Html.DisplayFor(modelItem => <#= property.ItemValueExpression #>)
        </div>
<#
    }
}

string pkName = GetPrimaryKeyName(mvcHost.ViewDataType);
if (pkName != null) {
#>
        <div class="medium-3 columns">
            <a href="@Url.Action("Edit", "Edit", new { id=item.<#= pkName #> })"><i class="fa fa-pencil"></i></a> |
            <a href="@Url.Action("Details", "Details", new { id=item.<#= pkName #> })"><i class="fa fa-file"></i></a> |
            <a href="@Url.Action("Delete", "Delete", new { id=item.<#= pkName #> })"><i class="fa fa-times"></i></a>
        </div>
<#
} else {
#>
        <div class="medium-3 columns">
            <a href='@Url.Action("Edit", "Edit", new { /* id=item.PrimaryKey */ })"><i class="fa fa-pencil"></i></a> |
            <a href="@Url.Action("Details", "Details", new { /* id=item.PrimaryKey */ })"><i class="fa fa-file"></i></a> |
            <a href="@Url.Action("Delete", "Delete", new { /* id=item.PrimaryKey */ })"><i class="fa fa-times"></i></a>
        </div>
<#
}
#>
    </div>
}

</div>
<#
// The following code closes the asp:Content tag used in the case of a master page and the body and html tags in the case of a regular view page
#>
<#
if(mvcHost.IsContentPage) {
#>
<#
} else if(!mvcHost.IsPartialView && !mvcHost.IsContentPage) {
    ClearIndent();
#>
</body>
</html>

如何替換ASP.Net的MVC4視圖以構建div而不是表

問題描述

1 個解決方案

解決方案1
1 已采納 2014-07-19 08:39:43

如何替換ASP.Net的MVC4視圖以構建div而不是表

問題描述

1 個解決方案

解決方案1 1 已采納 2014-07-19 08:39:43

解決方案1
1 已采納 2014-07-19 08:39:43