How to auto-select all text of an input field upon focus

API & Customization Show & Tell
1

To optimize the user experience, this code can be very useful. Just add it anywhere in your Javascript pane.

So everytime a text input field is activated (aka focused) using the mouse, keyboard or touch screen, the content will be full selected, ready to be overwritten. So you don't need to put your cursor anywhere or select the text, delete, erase characters or anything. Just go ahead and type over to replace the existing text, which is much faster most of the time. Of course, if this is not what you want, you can also put the cursor where you need it in the field to prevent editing, and add more text for example.

Note that this also works in tables where inline editing is enabled.

Enjoy!

//Auto-select text in all input fields, including inline editing.
$(document).on('focusin', function () {
    if (document.activeElement.classList.contains('drop-open')) { //Special case for inline editing in tables.
        $('.input').select();
    } else if (document.activeElement.classList.contains('input')) {
        if (document.activeElement.setSelectionRange) {
            document.activeElement.setSelectionRange(0, document.activeElement.value.length);
        } else {
            document.activeElement.select();
        }
    }
});