Panelbar inside a ListView

[Raventhorn]

I have a DataListView that contains a panelbar and the panelbar contains a textbox and button. I have the ListView bound to a SQL Datasource and the panelbar is not bound to anything. Inside the panel bar I need to set values to these controls using the Eval() command. However, it is returning null. If I move the textbox and button outside of the panelbar they can grab the data no problem. Once inside it's null. I know it's because they're looking for the datasource of the panelbar... is there anyway to override this? I want the textbox and button to get their values from the datasource of the listview.

<telerik:RadListView ID="wall" runat="server" Skin="Metro" AllowPaging="True" PageSize="200"
                    DataSourceID="WallSource">
                    <ItemTemplate>
                        <div class="wallPostPicture">
                            <telerik:RadBinaryImage ID="imgPosterPic" runat="server" DataValue='<%# Eval("Image") %>'
                                Height="50px" Width="50px" AutoAdjustImageControlSize="false" CssClass="friend" />
                            <telerik:RadToolTip ID="WallTip" runat="server" Position="MiddleRight" RelativeTo="Element"
                                Skin="Metro" TargetControlID="imgPosterPic" ShowEvent="OnMouseOver" HideEvent="LeaveTargetAndToolTip"
                                Animation="Resize" AutoCloseDelay="0" Title='<%# string.Format("{0} {1}", Eval("FirstName").ToString(), Eval("LastName").ToString())%>'>
                                <div>
                                    <div>
                                        <asp:Label ID="lblStatus" runat="server" Text='<%# Eval("Status") %>' /></div>
                                </div>
                            </telerik:RadToolTip>
                        </div>
                        <div style="float: right; padding-top: 10px;">
                            <asp:Label ID="lblCounter" runat="server" Text="0" CssClass="CounterText" ForeColor="LightGray" />
                        </div>
                        <div class="wallPostTitle">
                            <%# string.Format("{0} {1}", Eval("FirstName").ToString(), Eval("LastName").ToString())%></div>
                        <div class="wallPostDate">
                            <%# Eval("Date").ToString().ToLower() %></div>
                        <div class="wallPostDate" style="text-decoration: 'underline'">
                            <asp:LinkButton ID="lbtnRepost" runat="server" Text="repost" /> <b>·</b> <asp:LinkButton
                                ID="LinkButton1" runat="server" Text="upvote" /></div>
                        <div class="wallPostValue">
                            <%# Eval("Value") %></div>
                        <div class="wallPostComments">
                            <telerik:RadPanelBar runat="server" ID="RadPanelBar1" ExpandMode="SingleExpandedItem"
                                AllowCollapseAllItems="true" Skin="Metro" Width="100%" PersistStateInCookie="true">
                                <Items>
                                    <telerik:RadPanelItem Text='comments' Expanded="False" runat="server">
                                        <ContentTemplate>
                                            <telerik:RadListView runat="server" ID="listComments" Skin="Metro" AllowPaging="true"
                                                PageSize="15" DataSourceID="commentSource">
                                                <ItemTemplate>
                                                    <div class="commentBlock">
                                                        <div class="wallPostPicture">
                                                            <telerik:RadBinaryImage ID="imgPosterPic" runat="server" DataValue='<%# Eval("Image") %>'
                                                                Height="40px" Width="40px" AutoAdjustImageControlSize="false" CssClass="friend" />
                                                        </div>
                                                        <div class="wallPostTitle">
                                                            <%# string.Format("{0} {1}", Eval("FirstName").ToString(), Eval("LastName").ToString())%>
                                                        </div>
                                                        <div class="wallPostDate">
                                                            <%# Eval("Date").ToString() %>
                                                        </div>
                                                        <div class="wallPostValue">
                                                            <%# Eval("Value") %>
                                                        </div>
                                                    </div>
                                                </ItemTemplate>
                                            </telerik:RadListView>
                                            <span style="float: right; padding: 0px 10px 0px 0px;">
                                                <asp:Button ID="btnPostComment" runat="server" CssClass="blueButton" Text="post" CommandArgument='<%# Eval("PostId") %>' OnCommand="btnPostComment_Click" /></span>
                                            <div class="boxStatusmng" style="margin: 5px 0px 10px 0px; padding-left: 10px;">
                                                <span class="bannerStatusMngInput">
                                                    <asp:TextBox ID="txtCommentIt" runat="server" CssClass="statusbox" Height="35px" Text='<%# Eval("PostId") %>' /></span>
                                                    <asp:HiddenField runat="server" ID="hideWallId" Value='<%# Eval("PostId") %>' />
                                                <ajaxToolkit:TextBoxWatermarkExtender ID="wmComment" runat="server" TargetControlID="txtCommentIt"
                                                    WatermarkCssClass="statusboxwm" WatermarkText="say something..." />
                                            </div>
                                        </ContentTemplate>
                                    </telerik:RadPanelItem>
                                </Items>
                            </telerik:RadPanelBar>
                        </div>
                        <asp:SqlDataSource runat="server" ID="commentSource" ConnectionString="<%$ ConnectionStrings:MySqlConnection %>"
                            SelectCommand='<%# string.Format("SELECT * FROM Comments, UserDetails WHERE PostTargetId = {0} AND UserDetails.UserId = Comments.PosterUserId",  Eval("PostId")) %>' />
                    </ItemTemplate>
                </telerik:RadListView>
                <asp:SqlDataSource ID="WallSource" runat="server" ConnectionString="<%$ ConnectionStrings:MySqlConnection %>"
                    SelectCommand="SELECT FirstName, LastName, Status, Image, Poster, Value, Date, WallUserId, PostId FROM UserDetails, Wall WHERE Wall.WallUserId = @WallUserId AND UserDetails.UserId = Wall.Poster ORDER BY Wall.Date DESC">
                    <SelectParameters>
                        <asp:ControlParameter ControlID="hideme" Name="WallUserId" PropertyName="Value" Type="String" />
                    </SelectParameters>
                </asp:SqlDataSource>
                <asp:HiddenField ID="hideme" runat="server" />

[Peter]

Hello Shannon,

Your assumption is correct - you cannot bind controls inside RadPanelBar because the latter is a naming container and it also has to be data-binded.
 
If the nested RadPanelBar is declaratively defined in ItemTemplate of RadListView, then you can use the following workaround - handle ItemDataBound of RadListView to find the controls inside RadPanelBar and populate their properties using the DataItem property of the listview item. Here is an example:

<telerik:RadListView ID="wall" runat="server" Skin="Metro" OnItemDataBound="wall_ItemDataBound">
       <ItemTemplate>
           <div class="wallPostValue">
               <%# Eval("Value") %></div>
           <telerik:RadPanelBar ID="RadPanelBar1" runat="server">
               <Items>
                   <telerik:RadPanelItem runat="server" Text="Text">
                       <ContentTemplate>
                           Text:
                           <asp:literal id="LiteralText" runat="server"></asp:literal>
                       </ContentTemplate>
                   </telerik:RadPanelItem>
                   <telerik:RadPanelItem runat="server" Text="Value">
                       <ContentTemplate>
                           Value:
                           <asp:literal id="LiteralValue" runat="server"></asp:literal>
                       </ContentTemplate>
                   </telerik:RadPanelItem>
               </Items>
           </telerik:RadPanelBar>
       </ItemTemplate>
   </telerik:RadListView>

private DataTable CreateTestTable()
   {
       DataTable table = new DataTable();
       table.Columns.Add("ID");
       table.Columns.Add("Text");
       table.Columns.Add("Value");

       table.Rows.Add(new string[] { "1", "1", "A"});
       table.Rows.Add(new string[] { "2", "2", "B"});
       table.Rows.Add(new string[] { "3", "3", "C"});
       table.Rows.Add(new string[] { "4", "4", "D"});

       return table;
   }
   protected void Page_Load(object sender, EventArgs e)
   {
       if (!IsPostBack)
       {
           wall.DataSource = CreateTestTable();
           wall.DataBind();
       }
   }

   protected void wall_ItemDataBound(object sender, Telerik.Web.UI.RadListViewItemEventArgs e)
   {
       RadListViewDataItem currentItem = e.Item as RadListViewDataItem;
       DataRowView row = (DataRowView)currentItem.DataItem;


       RadPanelBar panelbar = e.Item.FindControl("RadPanelBar1") as RadPanelBar;

       Literal textLiteral = panelbar.FindItemByText("Text").FindControl("LiteralText") as Literal;
       textLiteral.Text = row["Text"].ToString();

       Literal valueLiteral = panelbar.FindItemByText("Value").FindControl("LiteralValue") as Literal;
       valueLiteral.Text = row["Value"].ToString();

   }

Attached is a sample for reference.

All the best,
Peter
the Telerik team