如何在 checkboxlist 控件中的复选框之前或之后添加 AjaxControlToolkit 的 Gravatar 控件

Question

我有一个 CheckBoxList 控件，其中包含动态生成的复选框项。此复选框列表将包含用户名。我正在使用 AjaxControlToolkit 中的 Gravatar 控件来允许用户拥有自己的个人资料图片。我想要的是，当一个以用户名作为文本的复选框被添加到CheckBoxList时，还应该在复选框之前或之后添加一个Gravatar控件，显示用户的相应显示图片。我想到的另一种方法是使用带有复选框和头像的自定义用户控件。但是，如果有任何其他可用的精简和简单的解决方案，那么请建议我。以下是代码：

<table class="style1">
                <tr>
                    <td align="right" style="padding: 5px" width="25%">
                        Username/Email:</td>
                    <td style="padding: 5px">
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                        &nbsp;<asp:Button ID="Button1" runat="server" CssClass="newButton" 
                            onclick="Button1_Click" Text="Search" />
                    </td>
                </tr>
                <tr>
                    <td align="right" style="padding: 5px" valign="top" width="25%">
                        Results:</td>
                    <td style="padding: 5px">
                        <asp:CheckBoxList ID="CheckBoxList1" runat="server" 
                            onselectedindexchanged="CheckBoxList1_SelectedIndexChanged" 
                            AutoPostBack="True">
                        </asp:CheckBoxList>
                    </td>
                </tr>
                <tr>
                    <td align="right" style="padding: 5px" width="25%" valign="top">
                        Selected People:</td>
                    <td style="padding: 5px">
                        <asp:ListBox ID="ListBox1" runat="server" Height="149px" Width="260px">
                        </asp:ListBox>
                    </td>
                </tr>
            </table>

如您所见，它还有一个列表框，其中包含从复选框列表中选择的项目。如果可能的话，请给我同样的列表框建议。

Answer 1

Repeater 控件适用于此。它允许您绑定到数据源并为项目的显示方式创建模板。

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="act" %>
...
<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>
        <asp:CheckBox ID="checkBox" runat="server" />
        <act:Gravatar runat="server" ID="gravatar" Email='<%# DataBinder.Eval(Container, "DataItem.useremail")%>' Size="50" Rating="G" DefaultImageBehavior="Identicon" DefaultImage="http://tinyurl.com/3bpsaac" />
        <asp:Label ID="userName" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.username")%>'></asp:Label>
        <br />
    </ItemTemplate>
</asp:Repeater>

我将此Repeater 绑定到以下DataTable：

System.Data.DataTable GetRepeaterData() {
    DataTable dt = new DataTable();
    dt.Columns.Add("username", typeof(string));
    dt.Columns.Add("useremail", typeof(string));
    dt.Rows.Add("user_one", "test@superexpert.com");
    dt.Rows.Add("user_two", "test@superexpert.com");
    dt.Rows.Add("user_three", "test@superexpert.com");
    return dt;
}