Hi,
I have 3 panes in websplitter.Since my div in 3rd pane was going outside i used the initialize event for making it inside 3rd pane.now on the divarrow click i have called the JavaScript function collapse() but i am not getting splitter inside this function using $find it returns null.
function collapse() { var splitter = $find('<%=Splitter.ClientID%>'); alert(splitter); var pane = splitter.getPaneAt(0); alert(pane); var size = pane.get_size(); var timer = setInterval(function () { size -= 20; pane.set_size(Math.max(10, size)); if (size <= 10) { clearInterval(timer); var barFor1stPane = splitter._elements['b0']; // or //var barFor1stPane = $(splitter.get_element()).find("[mkr='b0']")[0]; barFor1stPane.style.display = 'none'; } }, 30); }
function initSplitter(splitter) { var tbl = splitter._elements.tbl; if (tbl) tbl.style.tableLayout = 'auto'; }
<cc1:WebSplitter ID="Splitter" runat="server" BorderStyle="Solid" BorderColor="Black" BorderWidth="3px" ClientIDMode="Static" Style="display: block; height: 100%; position: absolute; visibility: visible; left: 5px; right: 100px; top: 65px; background-color: #F0F0F0; z-index: 999"> <ClientEvents Initialize="intialize" /> <Panes> <cc1:SplitterPane runat="server" Size="30%" ScrollBars="Hidden" Style="height: 100%" CollapsedDirection="None" Locked="true"> <Template>
<div id="test1" style="position: relative; width: 100%; height: 100%; z-index: 999"> <div id="header" class="x-panel-header x-unselectable" style="-moz-user-select: none; overflow: visible; top: 0px;"> <asp:Label ID="panelheader" runat="server" Text="Object Reader" CssClass="x-panel-header-text"></asp:Label> <div id="dvArrow" class="x-tool x-tool-toggle x-tool-collapse-west" onclick="collapse()"> </div> </div>
</div> </Template> </cc1:SplitterPane>
<cc1:SplitterPane runat="server" Size="40%" Style="height: 100%;" CollapsedDirection="None"> <Template>
</Template> </cc1:SplitterPane>
<cc1:SplitterPane runat="server" Size="30%" CollapsedDirection="None" Locked="true" Style="height: 100%"> <Template>
<div></div>
</Template> </cc1:SplitterPane
Hello Prajakta,
Please feel free to contact me if you are still experiencing issues with this scenario.
I have tested this scenario but am so far unable to replicate the described behavior. Attached is my test sample for your reference. In order to be able to continue my investigation, I would need a working sample illustrating the issue.
Please do not hesitate to contact me with any updates or questions.