Keyboard showing when not needed

ionic-v1
1

I have an app that uses a modal to let the user login. The user taps a field, keyboard pops up, user enters their password and either hits the keyboard ‘Go’ button or a button on the page. If the user presses the ‘Go’ button on the keyboard, everything works as expected - keyboard dismisses, modal hides, user is in the app. If they hit the button though, it will dismiss the keyboard and modal but then the keyboard will pop up again and I can’t see why this would happen. The page under the modal view doesn’t have any text fields so it shouldn’t be a focus issue.

The craziest thing is that this behavior doesn’t happen every time - it’s maybe every third time. I can provide some code if needed but I first wanted to check and see if anyone has had this type of thing with modals and keyboards.

2

try this

window.addEventListener('native.keyboardshow', function(keyboardEvent) {
    var ae = document.activeElement;
    if (ae.nodeName === 'INPUT' || ae.nodeName === 'SELECT' || ae.nodeName === 'TEXTAREA') {} else {
        cordova.plugins.Keyboard.close();
        return;
    }
});
3

Hey Christian, I feel your pain, I had the exact same problem. I don’t know if it is a bug or not, but this is a work around I used.

View:

<input type="text" ng-model="form.field" placeholder="An Input" ng-disabled="!enableInputs" />

Controller:

.controller('YourCtrl', function($scope, $ionicModal, $timeout) {

	$ionicModal.fromTemplateUrl('templates/modal-view.html', {
		scope: $scope
	}).then(function(modal) {
		$scope.modal = modal;
	});

	$scope.$on('open:your:modal', function(){

		$scope.enableInputs = false;

		$scope.modal.show();

		$timeout(function(){
			$scope.enableInputs = true;
		}, 500);

	});

});

Basically, I disable the inputs right before the modal is shown, and then 100ms after the modal is shown (since the CSS transition is 400ms) I reenabled them. That way the device won’t even think about doing some focus crap until the modal is even shown.