Which panelbar item are you?

[Stuart Hemming]

If I have dynamically created content in my panelbar items and I click on an object in my templated content, is there a client-side way I can find out which PanelBar item the content item I've clicked on is in?

--
Stuart

[Stuart Hemming]

Thinking some more about this, how 'safe' is it to use the PanelBarItem's UniqueID? What I was thinking was that I could pass this value to my content template to store and then use this to find the relevant PanelBar item as and when I need to.

I haven't yet checked ut I'm guessing that I can't use the UniqueID directly to search for the PanelBarItem and that I'd have to either assign it as the Value property or assign it to a Custom Attribute.

--
Stuart

[Atanas Korchev]

Hello Stuart,

One way to solve this is to use the ClientID property of the panel item. All controls that are children of some panel item have their HTML id attribute prefixed with the ClientID of their parent panel item. However setting the ID (hence ClientID) of a RadPanelItem is not allowed. You may end up hardcoding the ClientID.

The other solution is to use an internal JavaScript method of RadPanelBar which returns the nearest panel item object by given DOM element:

var panelItem = panelbar._extractItemFromDomElement(someElement);

Best wishes,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Paul]

Hi Stuart,

Please find below a sample code snippet that shows the needed approach.

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadPanelBar runat="server" ID="RadPanelBar1">
        <Items>
            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem1">
                <Items>
                    <telerik:RadPanelItem runat="server" Value="templateHolder">
                        <ItemTemplate>
                            <input id="Button1" type="button" value="button" />
                        </ItemTemplate>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelItem>
            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem2">
                <Items>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1">
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelItem>
        </Items>
    </telerik:RadPanelBar>

    <script type="text/javascript">
        $telerik.$("#Button1").click(function() {
            var current = $telerik.$(this);

            while (!current.is(".rpRootGroup > .rpItem")) {
                current = current.parent();
            }

            var rootItemObject = current[0]._item;

            alert(rootItemObject.get_text());
        });
    </script>

    </form>

All the best,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Stuart Hemming]

Thanks guys.

--
Stuart