Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
90
WebExplorerBar and WebSplitter
posted

Hi,

I have a page with a WebSplitter with 2 panes. On the first pane I have the WebExplorerBar. Each item within the WebExplorerBar have their values set to different URLs. When I click on an item I want pane 2 to navigate to the URL specified in the WebExplorerBar Item Value.

How do I set the contentUrl on pane 2 to the URL I have in the WebExplorerBar item's value using JavaScript?.

Please post sample code to accomplish the above task and also advise if there is a better way to do this.

Note: I do not want use the autopost back feature of the WebExplorerBar.

 

Thanks

Parents
  • 8160
    Verified Answer
    posted

    Hello,

    you could handle WebExplorerBar's click event and then set the Contet Url of the WebSpliiter's pane:


    <head runat="server">
        <title></title>
        <script type="text/javascript" id="igClientScript">
    <!--
            function WebExplorerBar1_ItemClick(sender, eventArgs) {
                ///<summary>
                ///
                ///</summary>
                ///<param name="sender" type="Infragistics.Web.UI.WebExplorerBar"></param>
                ///<param name="eventArgs" type="Infragistics.Web.UI.ExplorerBarEventArgs"></param>

                //Add code to handle your event here.
                var splitter = $find('<%=WebSplitter1.ClientID %>');
                if (eventArgs.getExplorerBarItem().get_text() == "Infragistics") {
                    splitter.get_panes()[1].set_contentUrl('http://infragistics.com');
                }
            }
    // -->
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <ig:WebScriptManager ID="WebScriptManager1" runat="server">
        </ig:WebScriptManager>
        <ig:WebSplitter ID="WebSplitter1" runat="server" Height="200px" Width="707px">
            <Panes>
                <ig:SplitterPane runat="server">
                    <Template>
                        <ig:WebExplorerBar ID="WebExplorerBar1" runat="server" GroupContentsHeight="" Width="250px">
                            <ClientEvents ItemClick="WebExplorerBar1_ItemClick"/>
                            <Groups>
                                <ig:ExplorerBarGroup GroupContentsHeight="" Text="Group">
                                    <Items>
                                        <ig:ExplorerBarItem Text="Infragistics">
                                        </ig:ExplorerBarItem>
                                    </Items>
                                </ig:ExplorerBarGroup>
                            </Groups>
                        </ig:WebExplorerBar>
                    </Template>
                </ig:SplitterPane>
                <ig:SplitterPane runat="server">
                </ig:SplitterPane>
            </Panes>
        </ig:WebSplitter>
        </form>
    </body>
    </html>

Reply Children
No Data