Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Alert should auto focus first input #16941

Open
adamdbradley opened this issue Jan 2, 2019 · 6 comments
Open

Alert should auto focus first input #16941

adamdbradley opened this issue Jan 2, 2019 · 6 comments
Labels
package: core @ionic/core package type: bug a confirmed bug report

Comments

@adamdbradley
Copy link
Contributor

Prompts don’t auto focus first input

@adamdbradley adamdbradley added package: core @ionic/core package type: bug a confirmed bug report labels Jan 2, 2019
@redwolf2
Copy link

redwolf2 commented Jan 3, 2019

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

@manucorporat
Copy link
Contributor

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

@cjorasch
Copy link

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.

@Yohandah
Copy link

Yohandah commented Apr 2, 2021

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

@GeorgeL9
Copy link

GeorgeL9 commented Mar 1, 2022

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

@FeehGb
Copy link

FeehGb commented Apr 29, 2022

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();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package type: bug a confirmed bug report
Projects
None yet
Development

No branches or pull requests

7 participants