Prevent tab key to the next slide with ion-slide and ion-slide-box

Hi everyone,

I have an issue with ion-slide. I have 3 different ion-slide in one ion-slide-box. Every slide has two inputs such as first name and last name. When user on slide #1, if he continue clicking on tab key, then it will takes him to every slide input. I want to prevent this happens. If he wants to go to next slide, he needs to press the button that navigate to that slide.

If I view this app on ionic view app on iphone, if I keep press on “>” key on keyboard, then it will shows all slides and they overlap each other. I am thinking about two possible solutions, one is disable “<” “>” on keyboard, and other way is sth that I have to disable the other slide. But I didn’t make it works.

Could anybody help me with this issue?


Hello, did you ever find a solution to this?

I’m having the same issue.

Hi, the solution that I did for this problem is put ng-if to ion-slide as . In controller, I will have logic to change this boolean value (showForgotPassForm) to true or false. When you want to navigate from one slide to the other slide, I use $ionicSlideBoxDelegate.slide(to) where to is the index of ion-slide.


Thank you for posting your solution.

Mine is slightly different, but here it is, in case it helps someone.

I found the tab key (on Android - my test environment) was only visible with an input type of number - eg:

So you’ll notice the trapping of ng-keydown, which calls this bit of code:

$scope.preventKeyPress = function($event){
		if ($event.keyCode === 9){


Ian Watson

Had the same problem…this solution worked perfectly. Thanks.