【问题标题】:Format a table in a view在视图中格式化表格
【发布时间】:2013-04-20 23:55:37
【问题描述】:

在我的应用程序中,我有一个视图,可以在其中获取基于此模型的项目列表:

public class ItemList
{
   public ObjInfo m_Obj { get; set;}

   public List<ObjData> m_ObjDataList { get; set;}
}

当我返回列表时,m_Obj 将始终被链接。 ObjData 的列表将在 0 和 4 之间变化,但出于格式目的,我需要始终显示 4 个插槽。

这就是我的观点的结构:

<table>
    <tr>
        <th>
            Object Name
        </th>
        <th>
            Obj Data
        </th>
        <th>
            Date of Data
        </th>
    </tr>

    @for (int i = 0; i < Model.Count; i++)
    {      
        <tr>
            <th rowspan="4">
                @Html.ActionLink(Model[i].m_Obj.m_ObjName, "ShowObjData", new { id = Model[i].m_Obj.m_ObjID })
            </th>
            @for (int j = 0; j < Model[i].m_ObjDataList.Count; j++)
            {
                <tr>
                    <td>@Html.DisplayFor(item => Model[i].m_ObjDataList[j].m_DataProvider.m_DataProviderName)</td>
                </tr>
                <tr>
                    <td>@Html.DisplayFor(item => Model[i].m_ObjDataList[j].AnIntValue)</td>
                </tr>
                <tr>
                     <td>@Html.DisplayFor(item => item[i].m_ObjDataList[j].m_DateDataSaved)</td>
                </tr>
            }
        </tr>
    }
</table>

所以,基本上,我想产生这样的效果:

Obj Name    Obj Data    Date of Data
Obj 1       Data 1          Date1
            Data 2          Date2
            Data 3          Date3
            Data 4          Date4
Obj 2       Data 1          Date1
            Data 2          Date2
            Data 3          Date3
            Data 4          Date4

但我很难像我喜欢的那样格式化值,这就是我寻求帮助的原因。

【问题讨论】:

  • 您应该在关闭&lt;/tr&gt; 之后移动内部for。这样,您将在 &lt;tr&gt; 之后有一个 &lt;tr&gt;,而不是像您当前的代码那样嵌套。

标签: c# html asp.net-mvc html-table


【解决方案1】:

经过大量工作找到了我的答案!

我需要像这样格式化我的表格:

<table class="objItemTable">
    <tr>
        <th>
            Object Name
        </th>
        <th>
            Provider
        </th>
        <th>
            Obj Data
        </th>
        <th>
            Date of Data
        </th>
    </tr>

    @for (int i = 0; i < Model.Count; i++)
    {
        var className = i%2 == 0 ? "even" : "odd";

        <tr>
            <th rowspan="5">
                @Html.ActionLink(Model[i].m_Obj.m_ObjName, "ShowObjData", new { id = Model[i].m_Obj.m_ObjId })
            </th>
            @for (int j = 0; j < Model[i].m_ObjDataList.Count; j++)
            {
                <tr class="@className">
                    <td>@Html.DisplayFor(item => Model[i].m_ObjDataList[j].m_DataProvider.m_DataProviderNa,e)</td>
                    <td>@Html.DisplayFor(item => Model[i].m_ObjDataList[j].AnIntValue)</td>
                    <td>@Html.DisplayFor(item => item[i].m_ObjDataList[j].m_DateDataSaved)</td>
                </tr>
            }
        </tr>
    }
</table>

... Annnnd 现在显示得很好。 :)

【讨论】:

  • 另外,既然这是解决方案,你可能应该接受答案:)
  • &lt;tr&gt; 中有&lt;tr&gt; 时,这个渲染效果如何?
  • @Floremin 现在这是一个非常有趣的问题,相信我,它有效,但是如何,我不知道:|
猜你喜欢
  • 2018-07-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-11-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多