Keyboard goes down on input


#1

Hello!

As many others I’m having issues with the keyboard. Everything works fine in the login page but after the user logs in I push a TabsPage and that is where my problems start.

The thing I want to do now is a searchfield. And on input I’m going to call a function. Currently a basic toast to get it going and it works, that’s not the issue. The problem is that everytime I enter a letter the keyboard goes down again and I have to push the input field again. I can’t find anything about this or I’m searching for the wrong things.

I’m importing Keyboard and adding it to provider in app.module.ts.

//Removed unnessesary stuff
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

//Ionic Native
import { Network } from '@ionic-native/network'
import { Keyboard } from '@ionic-native/keyboard'
import { QRScanner } from '@ionic-native/qr-scanner'

//HTTP CLIENT MODULE
import { HttpClientModule } from '@angular/common/http';

//Components
import { CustomHeaderComponent } from '../components/custom-header/custom-header'

//Pages Import
import { MyApp } from './app.component';

//Providers
import { HttpmethodsProvider } from '../providers/httpmethods/httpmethods';

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp, {
      scrollAssist: true,
      autoFocusAssist: true,
      scrollPadding: false
      /* platforms : {
        scrollAssist: false,
        autoFocusAssist: false
      } */
    }),
    HttpClientModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    HttpmethodsProvider,
    Keyboard
  ]
})
export class AppModule {}

HTML

<!-- Plus sign and search function -->
  <ion-item no-lines class='plusSearchBar'>
    <button item-start ion-button (click)='addUsers()' clear icon-only color='dark'><ion-icon name='add-circle'></ion-icon></button>
    <ion-input clearInput='true' [(ngModel)]='this.searchString' placeholder='Search users...' (input)='searchUsers()'></ion-input>
    <button item-end ion-button color='dark' (click)='searchUsers()' clear icon-only><ion-icon name='search'></ion-icon></button>
  </ion-item>

Logic

//Will add a user
  addUsers(): void {
    let toast = this.toast.create({
      message: 'Will add user',
      duration: 3000,
      position: 'middle'
    })

    toast.present()
  }

  //Will search a user
  searchUsers(): void {
    let toast = this.toast.create({
      message: this.searchString, 
      duration: 3000,
      position: 'middle'
    })

    toast.present()
  }

Any ideas on how to fix this problem? As you can see I’ve been experimenting with scrollAssist etc.

Ionic info

cli packages: (C:\Users\daniel karlsson\AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.19.2
    ionic (Ionic CLI) : 3.20.0

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 7.0.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node : v8.11.1
    npm  : 5.6.0
    OS   : Windows 10

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro

#2

Well, forgive me. The problem was the Toast… Well, anyone else might have this issue. So sorry for this. I feel dumb :stuck_out_tongue: