[Solved] RadPanelBar in a NestedViewTemplate?

[Tim]

I would like to create a custom detail view, revealed by ExpandCollapse Expand and hidden by Collapse.  In particular, I was trying to use a RadPanelBar to display several detail sections with the flexibility to open/close the detail sections.

Immediately inside my <NestedViewTemplate>, I can write

<%# Eval("something") %>

which evaluates into the value of the 'something' property for the selected row -- this works as expected.

Also nested inside my <NestedViewTemplate> I include a <telerik:RadPanelBar> and its associated <Items> and <telerik:RadPanelItem>.  Inside one <ItemTemplate>, I want to output some <%# Eval("something") %>.  However, they are always blank/empty at this point.

What am I missing?

Thanks,
Tim

Here is a snippet:

    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="AjaxLoadingPanel1"
        Height="100%" Width="100%">
        <telerik:RadGrid ID="RadGridExample" runat="server" AllowPaging="True" AllowSorting="True"
            AutoGenerateColumns="False" AllowMultiRowSelection="True" DataSourceID="ExampleSummaryDataSource"
            GridLines="None" Skin="Web20" OnPreRender="RadGridExample_PreRender" OnItemCommand="ItemCommand">
            <PagerStyle Mode="NextPrevNumericAndAdvanced" BackColor="#C6D9EA" Font-Bold="False"
                Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False"
                Wrap="True" />
            <MasterTableView DataSourceID="ExampleSummaryDataSource" CommandItemDisplay="Top"
                DataKeyNames="ExampleID">
                <NoRecordsTemplate>
                    <asp:Label ID="NoPoliciesToDisplay" runat="server" Text="There are no policies to display at this time.  Select the New command above to create a policy." />
                </NoRecordsTemplate>
                <CommandItemTemplate>
                    <div style="text-align: left; padding: 0px 0px 3px 5px;">
                        <asp:LinkButton ID="NewExampleButton" runat="server" CommandName="<%# NEW_COMMAND %>"
                            Visible='true'><img style="border:0px;vertical-align:middle;" alt="" src="images/addrecord.gif" />New</asp:LinkButton>&nbsp;
                        <%-- RebindGrid is handled by the RadGrid for us -- we do nothin--%>
                        &nbsp;&nbsp;
                        <asp:LinkButton ID="RebindButton" runat="server" CommandName="<%# REBIND_COMMAND %>"><img style="border:0px;vertical-align:middle;" alt="" src="images/refresh.gif" />Refresh</asp:LinkButton>
                    </div>
                </CommandItemTemplate>

                <NestedViewTemplate>
                    <div>
                        <!--
                          ****  THIS ONE WORKS ****
                        -->
                        {<%# Eval("ExampleID") %>}
                    </div>
                    <div class="text" style="background-color: <%# ExpandedRowBackground %>">
                        <telerik:RadPanelBar Width="100%" ID="RadPanelBarExampleDetail" runat="server" Skin="Web20"
                            ExpandMode="MultipleExpandedItems">
                            <Items>
                                <telerik:RadPanelItem runat="server" ID="RadPanelBarExampleDetailDetails" Text="Example Details">
                                    <Items>
                                        <telerik:RadPanelItem>
                                            <ItemTemplate>
                                                <div class="text" style="background-color: <%# ExpandedRowBackground %>">
                                                    <ul class="formList">
                                                        <li>
                                                            <!--
                                                              ****  THIS ONE IS ALWAYS BLANK ****
                                                            -->
                                                            {<%# Eval("ExampleID")%>}
                                                        </li>
                                                    </ul>
                                                </div>
                                            </ItemTemplate>
                                        </telerik:RadPanelItem>
                                    </Items>
                                </telerik:RadPanelItem>
                            </Items>
                        </telerik:RadPanelBar>
                    </div>
                </NestedViewTemplate>
                <RowIndicatorColumn Visible="False">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </RowIndicatorColumn>
                <ExpandCollapseColumn Visible="False" Resizable="False">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </ExpandCollapseColumn>
                <Columns>
                    <telerik:GridTemplateColumn UniqueName="CheckBoxTemplateColumn">
                        <HeaderStyle Width="30px"></HeaderStyle>
                        <HeaderTemplate>
                            <asp:CheckBox ID="headerChkbox" OnCheckedChanged="ToggleSelectedState" AutoPostBack="True"
                                runat="server"></asp:CheckBox>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <asp:CheckBox ID="CheckBox1" OnCheckedChanged="ToggleRowSelection" AutoPostBack="True"
                                runat="server"></asp:CheckBox>
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridBoundColumn Visible="false" DataField="ExampleID" HeaderText="ExampleID"
                        SortExpression="ExampleID" UniqueName="ExampleID" />
                </Columns>
                <EditFormSettings>
                    <PopUpSettings ScrollBars="None"></PopUpSettings>
                </EditFormSettings>
            </MasterTableView>
            <SelectedItemStyle BackColor="#2074C7" Font-Bold="False" Font-Italic="False" Font-Overline="False"
                Font-Strikeout="False" Font-Underline="False" ForeColor="White" Wrap="True" />
            <HeaderStyle BackColor="#092C90" Font-Bold="True" Font-Italic="False" Font-Overline="False"
                Font-Strikeout="False" Font-Underline="False" Wrap="True" ForeColor="White" />
        </telerik:RadGrid>
    </telerik:RadAjaxPanel>

[Shinu]

Hi Tim,

Try adding one Label in the ItemTemplate and bind the Text of the label with required field and see whether it is working.

<telerik:RadPanelItem runat="server" ID="RadPanelBarExampleDetailDetails" Text="Example Details">
     <Items>
       <telerik:RadPanelItem>
          <ItemTemplate>
              <div class="text" style="background-color: <%# ExpandedRowBackground %>">
                  <ul class="formList">
                   <li>

         <asp:Label ID="Label1" runat="server"  ></asp:Label>
                  </li>
                </ul>
            </div>
    </ItemTemplate>
 </telerik:RadPanelItem>

Thanks
Shinu.

[Tim]

I tried <asp:Label ... Text='<%# Eval("ExampleID")%>' /> with no success.  Is this what you meant?  If you meant more of a code-behind solution, please give me a bit more details on how to capture the required event.

Tim

[Bodevain Svensson]

How about modifying your binding expression to extract the data from the binding container of the parent grid item, i.e.:

'<%# DataBinder.Eval( Container, "Parent.BindingContainer.DataItem.ExampleID") %>

I think this should do the trick.

Bodevain

[Tim]

Thanks!  That almost worked.  What really works is Parent.Parent, i.e.

<%# DataBinder.Eval(Container, "Parent.Parent.BindingContainer.DataItem.Name") %>

Because of (I assume) the additional nesting of <ItemTemplate> ?

Tim