Server side PanelBar state (expanded/collapsed)

6 posts, 0 answers
  1. Phil
    Phil avatar
    273 posts
    Member since:
    Jul 2008

    Posted 27 Oct 2011 Link to this post

    Hi:
    It seems that the e.Item.Expanded in the ItemClick event is always false.  How can I find out the state of the Item?  Am I using the wrong control to toggle between configuration area and data display area?
    <%@ Page Language="VB" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        '
        Protected Sub defaultRadPanelBar_ItemClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadPanelBarEventArgs) Handles defaultRadPanelBar.ItemClick
            messageLabel.Text = e.Item.Text & " expanded: " & e.Item.Expanded.ToString
        End Sub
        '
    </script>
    <head runat="server">
        <title>Rad Panel</title>
    </head>
    <body>
        <form id="form1" runat="server">
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            </telerik:RadScriptManager>
            <telerik:RadPanelBar runat="server" ID="defaultRadPanelBar" Width="100%"
                ExpandMode="SingleExpandedItem">
                <Items>
                    <telerik:RadPanelItem Text="Data Parameters" Selected="True">
                        <ContentTemplate>
                            <center>
                                <h3>Params</h3>
                            </center>
                        </ContentTemplate>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="Data">
                        <ContentTemplate>
                            <center>
                                <h3>Data</h3>
                            </center>
                        </ContentTemplate>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelBar>
            <asp:Label ID="messageLabel" runat="server" Text="Label"></asp:Label>
        </form>
    </body>
    </html>
    Phil
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 28 Oct 2011 Link to this post

    Hello Phil,

    You can try the following code snippet if Item is present in the PanelBar. If you are using ContentTemplate,you can explicitly expand the PanelBar.

    VB:
    Protected Sub defaultRadPanelBar_ItemClick(sender As Object, e As RadPanelBarEventArgs)
            messageLabel.Text = Convert.ToString(e.Item.Text) & " expanded: " & e.Item.Expanded.ToString()
    End Sub

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Phil
    Phil avatar
    273 posts
    Member since:
    Jul 2008

    Posted 28 Oct 2011 Link to this post

    Hi:
    I am trying to get the state of one item, but I take it that ItemClick is called after the item has been collapsed.  I also needed the expand event, so I am creating one via the client side OnExpand.  So an updated sample is the following:
    <%@ Page Language="VB" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        '
        Protected Sub defaultRadPanelBar_ItemClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadPanelBarEventArgs) Handles defaultRadPanelBar.ItemClick
            ' messageLabel.Text = e.Item.Text & " expanded: " & e.Item.Expanded.ToString
            messageLabel.Text = Convert.ToString(e.Item.Text) & " expanded: " & e.Item.Expanded.ToString()
        End Sub
        '
        Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
            messageLabel.Text = defaultRadPanelBar.Items(1).Text & " expanded: " & defaultRadPanelBar.Items(1).Expanded.ToString()
        End Sub
        '
    </script>
    <head runat="server">
        <title>Rad Panel</title>
    </head>
    <body>
        <form id="form1" runat="server">
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            </telerik:RadScriptManager>
            <telerik:RadPanelBar runat="server" ID="defaultRadPanelBar" Width="100%"
                ExpandMode="SingleExpandedItem"
                OnClientItemExpand="OnPanelBarExpand"
                >
                <Items>
                    <telerik:RadPanelItem Text="Data Parameters" Selected="True">
                        <ContentTemplate>
                            <center>
                                <h3>Params</h3>
                            </center>
                        </ContentTemplate>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="Data">
                        <ContentTemplate>
                            <center>
                                <h3>Data</h3>
                                <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
                            </center>
                        </ContentTemplate>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelBar>
            <asp:Label ID="messageLabel" runat="server" Text="Label"></asp:Label>
            <!-- scripts -->
            <script type="text/javascript">
                //<![CDATA[
                // No service-side event when clicking on the expand button,
                // so the following calls the item click event
                function OnPanelBarExpand(sender, eventArgs) {
                    var barText = eventArgs.get_item().get_text();
                    if (barText == "Data") {
                        eventArgs.get_item().click();
                    }
                }
                //
                //]]>
            </script>
        </form>
    </body>
    </html>

    So, I think it is expanded then immediately collapsed.  Thus Expanded is always false.  Very interesting.

    Phil
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 28 Oct 2011 Link to this post

    Hello Phil,

    I tested the issue that you describe and with your current logic I am also not able to get e.Item.Expanded to be TRUE since every time I click on a RadPanelItem it collapses (it is no longer expanded and therefore e.Item.Expanded returns false). If you, however, change the ExpandMode property to MultipleExpandedItems, you get the correct behavior ( e.Item.Expanded returns true when the RadPanelItem is expanded and false when the RadPanelItem is collapsed). Please take a look at the attached runnable page for more reference. 

    Greetings,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  6. Phil
    Phil avatar
    273 posts
    Member since:
    Jul 2008

    Posted 30 Oct 2011 Link to this post

    Hi:
    I was thinking instead of handling it via PanelBar ItemClick, I would postback with a string identifier and handle it in Page_Load.
    Phil
    <script type="text/javascript">
        //<![CDATA[
        // No service-side event when clicking on the expand button,
        // so the following calls postback and Page_Load will handle it.
        function OnPanelBarExpand(sender, eventArgs) {
            var barText = eventArgs.get_item().get_text();
            if (barText == "Data") {
                __doPostBack('__Page', 'PanelBarExpand');
            }
        }
        //]]>
    </script>

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If (Not (IsPostBack)) Then
            '
        Else
            If Request("__EVENTARGUMENT") = "PanelBarExpand" Then
                '   Data Panelbar Expand clicked
            End If
        End If
    End Sub
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Nov 2011 Link to this post

    Hi Phil,

    Thank you for sharing your approach. Let me know if you still encounter any other issue that I could help you with.

    Best wishes,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017