Monaca Onsen UI Discord Chat Github Repo

Button in Tappable ListItem issue

  • I have a Button in a tappable ListItem. How can I prevent the ListItem to “react” to touch when the Button is pressed? I’ve tried catching and calling preventDefault() and stopPropagation() on the events returned by onTouchTap and onMouseDown on the Button but without success… The ListItemstill reacts when pressing the Button.

  • Onsen UI

    @zabojad Try stopPropagation() with mousedown and touchstart events :+1:
    I think we will add some kind of prevent-tap attribute to fix this properly.

    var button = document.querySelector('ons-button');
    var prevent = function(event) { event.stopPropagation(); };
    button.addEventListener('mousedown', prevent);
    button.addEventListener('touchstart', prevent);

  • For anyone else wondering about the same thing =>