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
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>
//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>
Thank you