Search code examples
javascriptandroidmobiletextfieldcursor-position

Moving the Cursor in an Input text on Android web browser


After Much searching I have decided to ask my first stack overflow question:

View page source for code, it is all on there.

I have a text box in which I am collecting a phone number in the specific format of (XXX) XXX-XXX).

I am doing this by auto populating the brace, space and dash in the text field. This works perfectly in everything I've tested except android phones.

When populated on an android phone the caret/cursor moves to the wrong place when the first brace is auto-populated and does not move to the end of the text box when the other auto formatting is preformed.

How would I keep the caret/cursor at the end of the field in an android web browser when auto populating data like this?


Solution

  • I've found a solution that works for my phone (HTC Evo 4g) and many of the phone around me. Unfortunately it appears android browsers are not standardized and handle things extremely different. I also feel that this solution is a bit hackish:

    functioning example can still be found at the location above

    Solution includes:

    I set a Timeout that uses this plug-in, that allows the simulation of a key board event, to add a pipe( | ) to the input text and then backspace over it. a creative solution but again, I don't feel it is very reliable, and A large percent of the phones I tried it with did not accept the solution.

    I am still open to other suggestions.