Question

我有一个我想用转发器渲染的项目列表，扭曲是这些项目需要在表格布局中的两列中呈现。此外，如果有奇数个项目，则最后一个单元格将包含占位符图像。有什么想法吗？

例如，我的列表[“string1”，“string2”，“string3”，“string4”，“string5”] 显示

<table>
 <tr>
    <td>string1</td> 
    <td>string2</td>
 </tr>
 <tr>
<td>string3</td> 
    <td>string4</td>
 </tr>
 <tr>
<td>string5</td> 
    <td>string6</td>  or [<td>Some place holder Imge if odd number </td>]
  </tr>
</table>

所以我最终得到了一个看起来像这样的视图

“String1”“String2”

“String3”“String4”

“String5”“String6”

或者如果列表具有奇数个项目

“String1”“String2”

“String3”“String4”

“String5”“某些占位符图片”

Answer 1

我们可以在标记中渲染两列。我们还必须添加一个占位符，我们将在代码中使用它来插入图像：

<asp:Repeater ID="rptMyRepeater" runat="server" OnItemDataBound="rptMyRepeater_ItemDataBound">
    <HeaderTemplate>
        <table>  
         <tr>     
    </HeaderTemplate>
    <ItemTemplate>
            <%# (Container.ItemIndex != 0 && Container.ItemIndex % 2 == 0) ? @"</tr><tr>" : string.Empty %> 
            <%# string.Format("{0}{1}{2}", @"<td>", Container.DataItem, @"</td>") %>
        <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </ItemTemplate>
    <FooterTemplate>
        </tr>
        </table>
    </FooterTemplate>
</asp:Repeater>

现在在代码中检查最后一项并检查它是否是奇数。如果是，则在td中添加图像，将td附加到占位符：

protected void rptMyRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        int count = ((List<string>)rptMyRepeater.DataSource).Count;
        if (e.Item.ItemIndex != 0 && e.Item.ItemIndex % 2 == 0 && e.Item.ItemIndex == count - 1)
        {
            PlaceHolder PlaceHolder1 = e.Item.FindControl("PlaceHolder1") as PlaceHolder;
            Image img = new Image();
            img.ImageUrl="pholder.jpg";
            TableCell td = new TableCell();
            td.Controls.Add(img);
            PlaceHolder1.Controls.Add(td);
        }     
    }
}

我用于测试的代码：

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        //rptMyRepeater.DataSource = new List<String>() { "String1", "String2", "String3", "String4", "String5", "String6" };
        rptMyRepeater.DataSource = new List<String>() { "String1", "String2", "String3", "String4", "String5" };
        rptMyRepeater.DataBind();

    }
}

希望它有所帮助！

如何使用asp.net转发器呈现两个列布局

1 个答案: