Keyboard opened and Side Menu toggle

Maybe this is not a very common use case, but If I have a form in a view with a focused input (so the on screen keyboard is appearing) then I accidentally or intentionally dragged left/right or toggled the side menu, the keyboard will still be opened while also the slide menu is opened.

To get around this I had a couple of solutions in my mind, either disabling the dragging while inputs are focused to avoid the case if the user was long tapping to move the cursor left or right that may open the side menu unintentionally.

The second solution which I implemented in my main controller is to hide the keyboard when the side menu open ration is more than zero by blurring active element. I think it’s not the best solution ever.

$scope.$watch('sideMenuController.getOpenRatio()', function(ratio) {
    if(Math.abs(ratio) > 0){
      document.activeElement.blur();
    }
  });

I would like to hear from you and know what is the default behaviour for something like this in native apps with side menu. If you see that it’s a common use case I would like to see this implemented in ionic core.

How about using ng-show or ng-if for the side menu. When a field gets focus set $scope.allowSideMenu = false . Then, the side menu can’t be opened accidentally. Some performance concerns here though, especially with ng-if as Angular completely removes it from the DOM and then would have to put it back in.

Alternatively, your controller could detect Gestures and kill them. I THINK you could kill them in your controller and stop them from getting propagated up.

1 Like