Question

I am creating a html form that needs to work for users of older mobile devices.

The problem I have is when using an older Blackberry device, such as a 2 year old 9300, if you use the trackpad to move to the right of the text field, then the text scrolls off to the left and becomes hidden.

Is there any way to prevent this behaviour, or even to realign the text after the input has lost focus?

The problem is apparent even with a form as simple as this.

<form>
<input type="text" name="testit" />
</form>

Answer 1

In case it helps anyone else, I have found a way to fix this – but if anyone can think of a better solution I’d love to hear it.

I simply clear the textfield and then rewrite the value to the textfield when the mouse leaves the input.

<script type="text/javascript">
function updateTheText()
{
  var boxVal = $('#testit').val();
  $('#testit').val('');
  $('#testit').val(boxVal);
}
</script>

and then add an onmouseout to the input

<form>
<input type="text" id="testit" name="testit" onmouseout="updateTheText()" />
</form>