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
635
How to disable splitter by javascript
posted

I am using infragistics websplitter control.i have added button on page.on button click the first pane is collapsed.but splitter bar is still draggable.i want to disable dragging by javascript.

  • 24497
    Verified Answer
    posted

    Hi Prajakta,

    I am not sure why you need to disable drag for collapsed splitter pane. A collapsed pane should not be draggable, otherwise it would be a bug in WebSplitter. If that happens in your application, then it would be great if you submit a bug report with sample application and steps to reproduce.

    If you need to disable drag conditionally, then you have to process Moving client side event. Example below toggles collapsed state of first pane and prevents dragging conditionally. Current condition assumes your scenario (disable dragging of collapsed pane), but as I mentioned that, changes nothing, because a collapsed pane is already not draggable. You may use another condition to prevent dragging, just call

    if (myCondition) eventArgs.set_cancel(true);

     

    <script type="text/javascript">
     
    var disableDrag;
     
    function WebSplitter1_SplitterBarMoving(sender, eventArgs) {
        if (disableDrag)
         
    eventArgs.set_cancel(true);
     
    }
      function toggle() {
       
    var splitter = $find("WebSplitter1");
       
    var pane0 = splitter.get_panes()[0];
       
    var collapsed = pane0.get_collapsed();
        disableDrag = collapsed;
       
    pane0.set_collapsed(!collapsed);
      }
    </script>

    <ig:WebSplitter ID="WebSplitter1" ...>
      ...
     
    <ClientEvents SplitterBarMoving="WebSplitter1_SplitterBarMoving" />
    </ig:WebSplitter>
    <input type="button" value="toggle collapse" onclick="toggle()" />