ionic-framework icon indicating copy to clipboard operation
ionic-framework copied to clipboard

Alert should auto focus first input

Open adamdbradley opened this issue 6 years ago • 6 comments

Prompts don’t auto focus first input

adamdbradley avatar Jan 02 '19 19:01 adamdbradley

That should be a setting. Otherwise there will always be a software keyboard popup on mobile platforms.

redwolf2 avatar Jan 03 '19 10:01 redwolf2

Not that easy, since element.focus() is noop if it's not coming from an user interaction.

manucorporat avatar Jan 04 '19 10:01 manucorporat

There might be challenges if running on a mobile device (due to keyboard popup) but it seems like you would always want to set focus on a desktop web page. Most web apps (including GitHub) set input focus when you click on buttons that lead to data entry. It seems very awkward to click on a button, have an alert displayed to enter a value, and still have to click in the input before entering the value.

cjorasch avatar Feb 15 '19 20:02 cjorasch

Hoping this feature is coming to Ionic 6 ! I am in need of this as well

Yohandah avatar Apr 02 '21 12:04 Yohandah

Any updates on this? Doesn't seem this feature made it into v6.

GeorgeL9 avatar Mar 01 '22 22:03 GeorgeL9

you can resolve it like this:

const alert = await this.alertCtrl.create(
        {
          header: "Motivo!",
          message: 'Descreva um motivo para <strong>rejeição</strong>!',
          inputs: [
            {
              name: 'comentario',
              id: 'comentario',
              type: 'textarea',
              placeholder: 'Descreva um motivo'
            }
          ],
          buttons: [
            {
              text: 'Cancelar',
              id: 'confirm-button',
              handler: async (data: object) => {
                resolve(false)
              }
            },
            {
              text: 'OK',
              id: 'confirm-button',
              handler: async (data: object) => {
                resolve(data)
              }
            },
          ]
        })

      await alert.present()
      const comentario :HTMLElement = document.querySelector("#comentario");
      comentario.focus();

FeehGb avatar Apr 29 '22 14:04 FeehGb