3. Unable to disable ons-splitter-side Gesture Detector

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Unable to disable ons-splitter-side Gesture Detector

  • C

    Hi Friends,

    I want to disable Gesture Detector of ons-splitter-side on a specific screen as I need to provide drag and drop feature. I have done similar implementation in older version of Onsen UI by calling dispose() of gesture detector of body and ons-splitter-side BUT that’s not working in Onsen UI 2.7.0.

    I have setup two Codepen samples to make this clear. Both the samples uses same CSS and JS libraries.

    Sample 1 - **WORKING ** - The text can be dragged. It is directly inside the body. Have disposed Gesture Detector of body in controller.

    Sample 2 - **NOT WORKING ** - The text can’t be dragged. It placed inside splitter side. Have tried disposing Gesture Detector of splitter side using ons.GestureDetector(document.getElementById(‘splitterMenuDemo’)).dispose() BUT it’s not working…

    In older version of Onsen UI, it was done using document.getElementById(‘splitterMenuDemo’)._gestureDetector.dispose() BUT that’s throwing an error in new version.

    I tried various other properties and functions but couldn’t find the solution.

    A help here would be much appreciated.

    Thanks & Regards,
    CNaik.

    0 1 Reply
  • Onsen UI

    @CNaik The one you are looking for is probably document.getElementById(‘splitterMenuDemo’)._swipe.gestureDetector.

    0
    C
     1 Reply
  • C

    @Fran-Diox

    Thank you for your quick reply.

    Yes, the solution worked in Codepen. BUT didn’t work in the actual application which has content with more hierarchy of ons-splitter -> ons-splitter-content -> few navigation controller -> ons-page.

    I have double checked the library linking and other such things. In fact OnDrag event is being called in controller. So I guess something else in Onsen UI might be blocking drag effect?

    Can you give me advise what else could be preventing drag effect?

    Regards,
    CNaik.

    0 1 Reply
  • Onsen UI

    @CNaik Oh! The navigator also has a GestureDetector now for the swipe-to-pop functionality. You can access it the same way as the splitter: myNavigator._swipe.gestureDetector.

    Hmm, maybe we should remove the gesture detector if the swipeable attribute is removed…

    0
  • C

    Moved one step closer.
    I can make DIV draggable which directly on the page.

    But still DIVs under ons-list can’t be dragged. I tried getting list’s gesture detector without luck. What else in ons-list or ons-list-item can be preventing drag?

    Regards,
    CNaik.

    0 1 Reply
  • Onsen UI

    @CNaik Can you try without tappable and ripple effects? I’m not really sure why :confused:

    0