Can we turn off auto capitalization on ion-input?

I would like to turn off the auto capitalization on fields where I am entering username, urls etc.

I have tried adding <ion-input type="text" autocapitalize="none" but this has had no effect (on Android at any rate)

I notice it does not occur on password fields, but I also need it on just text fields.

Does anyone know a way to disable this?
Thanks in advance!

2 Likes

Just had a quick look at ion-input's source code. Doesn’t look like there is an option to set autocapitalize.

Try setting autocomplete to off. AFAIK that should do the trick.

If that doesn’t work, then let me know. I have another solution for you.

Thanks for that. Unfortunately it didn’t seem to work. I have tried the following

 <ion-input type="text" autocomplete='off' autocorrect='off' autocapitalize='off' [(ngModel)]='urlEntered'></ion-input>

but I still get the caps.

Setting the type to email does work, but the ios keyboard for email does not include some of the characters need for a url (eg : // )

I was going to suggest creating a directive that adds autocapitalize="off" to the child input element. But I just realized that Ionic Framework passes on the attributes automatically to it’s child element.

I think what you’re experiencing is a compatibility issue. Not all browsers support autocapitalize. It was originally made for iOS devices (see https://developers.google.com/web/updates/2015/04/autocapitalize).

You can also try using autocapitalize="none" as the off option has been deprecated

Hmm tried the autocapitalize="none" but still didn’t pick it up. My current workaround is to use type=“url” (for all my fields)

7 Likes

works well, thank you very much

perfect work around! thank u

Perfect Thanks so much.
:joy:

Works but it shows the keyboard as url so you cannot see the spacebar