使用中继器的水平表

时间：2011-08-02 15:00:05

标签： html asp.net .net html-table repeater

我正在尝试使用转发器获取下表。

<table>
    <tr>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
    </tr>
    <tr>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
    </tr>
</table>

但我无法解决如何做到这一点。我尝试过以下方法：

<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
        <tr>
    </HeaderTemplate>
        <ItemTemplate>
            <td>Description:</td>
            <td>Start time:</td>
            <td>End time:</td>
            <td>Game type:</td>
        </ItemTemplate>
        <SeparatorTemplate>
            </tr><tr>
        </SeparatorTemplate>
        <AlternatingItemTemplate>
            <td><%# Eval("Description") %></td>
            <td><%# Eval("StartTime") %></td>
            <td><%# Eval("EndTime") %></td>
            <td><%# Eval("GameType") %></td>
        </AlternatingItemTemplate>
    <FooterTemplate>
        </tr>
        </table>
    </FooterTemplate>
</asp:Repeater>

如果最后应用了分隔符模板，它会很有效。 那么使用每个数据项的单个表来使这种模式工作的唯一方法是什么？或者我有一种方法可以使用一个表来实现我的目标吗？

5 个答案:

答案 0 :(得分：4)

您可以尝试在HeaderTemplate中编写表格的标题和ItemTemplate中的行;-)

编辑：首先，我认为您只需要标题中的标题，每行代表数据项。所以我建议使用以下代码：

<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
        <tr>
            <td>Description:</td>
            <td>Start time:</td>
            <td>End time:</td>
            <td>Game type:</td>
        </tr>
    </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td><%# Eval("Description") %></td>
                <td><%# Eval("StartTime") %></td>
                <td><%# Eval("EndTime") %></td>
                <td><%# Eval("GameType") %></td>
            </tr>
        </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

现在，在您的评论中重复每个数据项上方的标题后，我建议如下：

<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td>Description:</td>
                <td>Start time:</td>
                <td>End time:</td>
                <td>Game type:</td>
            </tr>
            <tr>
                <td><%# Eval("Description") %></td>
                <td><%# Eval("StartTime") %></td>
                <td><%# Eval("EndTime") %></td>
                <td><%# Eval("GameType") %></td>
            </tr>
        </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

注意：您使用的AlternatingItemTemplate也表示数据项。通过使用此功能，您可以为每个项目以不同的方式显示数据项（通常，您对奇数和偶数行使用不同的背景颜色）

编辑2： 我希望，这次我正确理解了这个问题： - ）

<asp:Repeater ID="rptGames" runat="server" OnItemCreated="rptGames_ItemCreated">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td>Description:</td>
                <td>Start time:</td>
                <td>End time:</td>
                <td>Game type:</td>
                <td>Description:</td>
                <td>Start time:</td>
                <td>End time:</td>
                <td>Game type:</td>
            </tr>
            <tr>
                <td><%# Eval("Description") %></td>
                <td><%# Eval("StartTime") %></td>
                <td><%# Eval("EndTime") %></td>
                <td><%# Eval("GameType") %></td>
        </ItemTemplate>
        <AlernatingItemTemplate>
                <td><%# Eval("Description") %></td>
                <td><%# Eval("StartTime") %></td>
                <td><%# Eval("EndTime") %></td>
                <td><%# Eval("GameType") %></td>
            </tr>
        </AlernatingItemTemplate>

</asp:Repeater>

在后面的代码（rptGames_ItemCreated）中，您可以根据数据项的数量设置页脚模板</table>或</tr></table> 注意：我没有测试过这个

答案 1 :(得分：1)

试试这样：

更新：要重复标题（根据OP的评论），请按照这样修改（如果您想要更多列，请在每个td中添加更多tr）：

注意：假设OP想要以不同方式设置标题样式，请添加背景颜色（仅提供一个想法）。

<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
        <ItemTemplate>
            <tr style="background-color: whiteSmoke">
              <td>Description:</td>
              <td>Start time:</td>
              <td>End time:</td>
              <td>Game type:</td>
            </tr>
        </ItemTemplate>
        <AlternatingItemTemplate>
          <tr>
            <td><%# Eval("Description") %></td>
            <td><%# Eval("StartTime") %></td>
            <td><%# Eval("EndTime") %></td>
            <td><%# Eval("GameType") %></td>
          </tr>
        </AlternatingItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

答案 2 :(得分：1)

将表格标题行移动到标题中，并将每个项目封装在tr

中 
<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
        <tr>
            <td>Description:</td>
            <td>Start time:</td>
            <td>End time:</td>
            <td>Game type:</td>
        </tr>
    </HeaderTemplate>
        <ItemTemplate>
           <tr>
            <td><%# Eval("Description") %></td>
            <td><%# Eval("StartTime") %></td>
            <td><%# Eval("EndTime") %></td>
            <td><%# Eval("GameType") %></td>
           </tr>
        </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

答案 3 :(得分：0)

您需要将<tr>放入商品模板（以及交替商品模板）（而不是标题）。

<ItemTemplate>
<tr>
   <td>Description:</td>
   <td>Start time:</td>
   <td>End time:</td>
   <td>Game type:</td>
</tr>
</ItemTemplate>

然后调整您的分隔符模板：

<SeparatorTemplate>
   <tr></tr>
</SeparatorTemplate>

答案 4 :(得分：0)

试试这个：

<asp:Repeater ID="rptGames" runat="server">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
        <ItemTemplate>
          <tr>
              <th>Description:</th>
              <th>Start time:</th>
              <th>End time:</th>
              <th>Game type:</th>
              <th>Description:</th>
              <th>Start time:</th>
              <th>End time:</th>
              <th>Game type:</th>
            </tr>
          <tr> 
            <td><%# Eval("Description") %></td>
            <td><%# Eval("StartTime") %></td>
            <td><%# Eval("EndTime") %></td>
            <td><%# Eval("GameType") %></td>
        </ItemTemplate>
        <AlternatingItemTemplate>
            <td><%# Eval("Description") %></td>
            <td><%# Eval("StartTime") %></td>
            <td><%# Eval("EndTime") %></td>
            <td><%# Eval("GameType") %></td>
          </tr>
        </AlternatingItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

我的例子中唯一的问题是，如果没有偶数个记录，则不会打印结束</tr>，表格可能会失控。我相信你可以在后面的代码中检查它并为此添加一个hack。也许你可以在运行时修改literal？

<强>更新

该代码应该产生以下六条记录的结果：

<table>
    <tr>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
    </tr>
    <tr>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
    </tr>
    <tr>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
    </tr>
    <tr>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
    </tr>
    <tr>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
        <td>Description:</td>
        <td>Start time:</td>
        <td>End time:</td>
        <td>Game type:</td>
    </tr>
    <tr>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
        <td>Data1</td>
        <td>Data2</td>
        <td>Data3</td>
        <td>Data4</td>
    </tr>
</table>

相关问题
最新问题