Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery focus on first text field and set cursor at value end for instant data entry

Tags:

jquery

focus

I am loading a form and defaulting focus to the first text field. The text field is populated with a default value "PW-". (The first characters of the customers part number like PW-446, PW-9887)

They want to just start typing the numbers upon form load instead of clicking to the end of the field, etc to type numbers. The cursor should be blinking at the end of the PW- and ready to go for data input.

I have tried many different methods found on StackOverflow with no luck :-(
Any ideas? Thanks in advance!

JQUERY

$(document).ready(function(){

    $('input:text:first').focus();

});

HTML

< input type="text" name="part_id" size="20" value="PW-">
like image 783
Michael Avatar asked Sep 29 '12 16:09

Michael


1 Answers

Here's an EXAMPLE:

$(document).ready(function(){
    var el = $("input:text").get(0);
    var elemLen = el.value.length;

    el.selectionStart = elemLen;
    el.selectionEnd = elemLen;
    el.focus();
});​

https://developer.mozilla.org/en-US/docs/XUL/Property/selectionStart

https://developer.mozilla.org/en-US/docs/XUL/Property/selectionEnd

For older versions of IE you may need to use: http://msdn.microsoft.com/en-us/library/ie/ms536401(v=vs.85).aspx

like image 108
Chase Avatar answered Oct 22 '22 01:10

Chase