Textboxes in some android devices

[John]

I noticed that some android devices have issues with properly displaying a text box (an input element). The text appears invisible as you type because the text appears black over the black background. The device I am able to reproduce this on is the Google Nexus 7, using the forms demo on the Kendo UI site.

Is there a workaround that will guarantee that the text is a visible colour on all platforms? For example, white in android and black in iOS. 

Thanks in advance,
John

[Kamen Bundev]

Hi John,

I wasn't able to reproduce this issue. Which browser did you use on the Nexus 7?

All the best,
Kamen Bundev
the Telerik team

[John]

Hi Kamen, 

I am using the google chrome browser on the google nexus 7. The text in the textfield appears visible at first (white text over a black background), but once you focus it and hit backspace once, the text all of a suddenly changes color (black text over a black background).

Hope this helps.

Thanks,
John

[Kamen Bundev]

Hello John,

Yes, deleting does the trick - I was able to reproduce it, but unfortunately this looks like a new feature (an input autocomplete) in Chrome for Android browser which styling can't be overridden and this feature can't be turned off (for instance autocomplete="off" on the form should be working, but it doesn't).

Greetings,
Kamen Bundev
the Telerik team

[Thane]

I am having this same issue on any Android device using the Android version of Chrome.  I've Googled it for a few days and this is the only resource I can find where someone is even talking about the same problem.  Did either of you ever find a solution?

[Kamen Bundev]

Hi Thane,

Unfortunately no - the auto complete in Chrome for Android is not styleable and can't be switched off at this moment. I've just filed a bug in their bug tracker, you can star it to show that you can reproduce it.

All the best,
Kamen Bundev
the Telerik team

[John]

I applied the following workaround to ensure the text always appears visible.

$(".km-android #myTextField").css("color", "black");

$(".km-android #myTextField").css("background-color", "white");

The 'color' property should be black to maintain consistency with what Chrome will automatically override the styling with. As for the background, as long as it contrasts black, it should be visible. I chose white.

Hope this helps,
John

[Berin]

I'm having some issues with my phone as well.

It doesn't matter if I use the built in browser, or another one such as Dolphin - Text appears to not be entered.

If I flip out my keyboard and attempt to type, the browser sometimes crashes.  Text can be seen sometimes, but I'm experiencing weird behavior like "Text copied to clipboard" when I shift to an uppercase letter.   If I make it as far as the email address field, I cannot enter a ".".

I'm using a Motorola DROID3, Android version 2.3.4.

[Kamen Bundev]

Hello Berin,

The issues you experience are different than the ones in this thread. Check this documentation article for more info and a possible workaround.

Greetings,
Kamen Bundev
the Telerik team

[Berin]

This is exactly what I was looking for!  Thank you for pointing me in the right direction.