问题描述
|
我之前已经建造过中继器,但是没有太多经验来处理中继器。目前,我有一台直放站,可以正确填充数据,但在一列中可以正确填充数据。我希望它是4列。有人告诉我使用分隔符模板是执行此操作的最佳方法。
这是我的中继器:
<asp:Repeater ID=\"myTestRepeater\" runat=\"server\"
onitemdatabound=\"myTest_ItemDataBound\">
<Itemtemplate>
<table cellpadding=0 width=\"100%\" valign=\"top\">
<tr>
<td valign=\"top\" width=\"100%\">
<asp:HyperLink ID=\"lnkTest1\" runat=\"server\">
<asp:Image ID=\"imgTest\" runat=\"server\" /></asp:HyperLink>
<asp:HyperLink ID=\"lnkTest2\" runat=\"server\" />
<asp:Label ID=\"lblCounter\" runat=\"server />
<asp:HyperLink ID=\"lnkTest3\" runat=\"server\"/>
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
解决方法
中继器是ASP.NET WebForms工具库中功能最强大的控件。您只需要有时考虑一下使用它的最佳方法。
例如,您可以有一个中继器来创建多行,并有一个中继器来创建多列。在您的情况下,如果希望中继器创建多列,则可以轻松调整代码:
<asp:Repeater ID=\"myRepeater\" runat=\"server\">
<HeaderTemplate>
<table>
<tr>
</HeaderTemplate>
<ItemTemplate>
<td>
<span>This will be repeated for each element</span>
</td>
</ItemTemplate>
<FooterTemplate>
</tr>
</table>
</FooterTemplate>
</asp:Repeater>
基本上,这就是您要实现循环的方式。
, 分隔符模板用于定义行之间的分隔符。为什么不能在四个列中使用四个<td/>
?
<Itemtemplate>
<tr>
<td>
...
</td>
<td>
...
</td>
<td>
...
</td>
<td>
...
</td>
</tr>
</ItemTemplate>
, 尝试这个
<asp:Repeater runat=\"server\" ID=\"myRepeater\">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
Col 1
</td>
<td>
Col 2
</td>
<td>
Col 3
</td>
<td>
Col 4
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table></FooterTemplate>
<SeparatorTemplate>
<tr>
<td colspan=\"4\" style=\"background-color: #E1E1E1\">
</td>
</tr>
</SeparatorTemplate>
</asp:Repeater>
, 我最终使用文字作为表中断。然后根据我的计数器的mod填充该文字
<asp:Repeater ID=\"myTestRepeater\" runat=\"server\"
onitemdatabound=\"myTest_ItemDataBound\">
<Itemtemplate>
<table cellpadding=0 width=\"100%\">
<tr>
<td valign=\"top\" width=\"25%\">
<asp:HyperLink ID=\"lnkTest1\" runat=\"server\">
<asp:Image ID=\"imgTest\" runat=\"server\" /></asp:HyperLink>
<asp:HyperLink ID=\"lnkTest2\" runat=\"server\" />
<asp:Label ID=\"lblCounter\" runat=\"server />
<asp:HyperLink ID=\"lnkTest3\" runat=\"server\"/>
</td>
<asp:literal id=\"tablebreak\" runat=\"server\"></asp:literal>
</ItemTemplate>
</asp:Repeater>
然后在后面编码
Literal tableBreak = (Literal)e.Item.FindControl(\"tablebreak\");
if (e.Item.ItemIndex % 4 == 3)
tableBreak.Text = \"</tr><tr>\";
, 这是遵循中继器控制约定的方法。
<asp:Repeater id=\"rptTest\" runat=\"server\">
<HeaderTemplate>
<table border=\"1\">
<tr>
</HeaderTemplate>
<ItemTemplate>
<td>
<asp:Literal ID=\"litContent\" runat=\"server\" />
</td>
</ItemTemplate>
<SeparatorTemplate>
</tr>
<tr>
</SeparatorTemplate>
<FooterTemplate>
</tr>
</table>
</FooterTemplate>
</asp:Repeater>
后面的代码:
int counter = 0,columnCount = 3;
rptTest.ItemDataBound += (rpt_sender,rpt_e) => {
if (rpt_e.Item.ItemType == ListItemType.Item || rpt_e.Item.ItemType == ListItemType.AlternatingItem) {
string cellData = (string)rpt_e.Item.DataItem;
Literal litContent = (Literal)rpt_e.Item.FindControl(\"litContent\");
litContent.Text = cellData;
}
else if (rpt_e.Item.ItemType == ListItemType.Separator) {
if (++counter % columnCount != 0)
rpt_e.Item.Visible = false;
}
};
rptTest.DataSource = new string[] { \"Cell 1\",\"Cell 2\",\"Cell 3\",\"Cell 4\",\"Cell 5\",\"Cell 6\",\"Cell 7\",\"Cell 8\",\"Cell 9\",\"Cell 10\" };
rptTest.DataBind();