Imagine you have ten fields of text to modify and that you have to press delete each time before entering the new amount. The user experience during data entry can be improved by auto selecting the content of a text field before the user starts typing. That will prevent the user from having to clear the field themselves by using the backspace button.

Oracle APEX – Auto Selecting Text on Focus

This feature can easily be achieved in Oracle APEX with some basic JavaScript.  All that’s required is to create a dynamic action On Click on your text field and use the following JavaScript code in your true action:

var fieldLength = Number(this.triggeringElement.value.length); //Get the content’s length

//select the whole content of the field
this.triggeringElement.selectionStart = 0;
this.triggeringElement.selectionEnd = fieldLength;

The reason why On Focus isn’t used is because the same code does not work on iOS devices as of this writing. The drawback of using On Click instead of On Focus is that when tabbing through fields, they won’t be auto selected.

Best practice would be to have your dynamic action on your Global Page and making it affect a certain class, by using a jQuery selector – similar to this:

If the auto select behavior is not required when running the application from a desktop, you could always put a condition on the dynamic action based on the device used. This can be done by reading the HTTP User Agent.

Amongst other things, the User Agent provides information on the browser used by the user.  As a result. the condition could look like this:

upper(OWA_UTIL.GET_CGI_ENV(‘HTTP_USER_AGENT’))LIKE‘%MOBILE%’

The condition could be more specific, but since most mobile device browsers have the keyword, mobile, in their User Agent info, this condition is a safe assumption.

Note: For those wondering why didn’t I simply use jQuery’s select() method for auto selecting text on focus, well, for some reason it didn’t work on iOS devices….*sigh*

Learn more about APEX

Share this: