Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations John Tel on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to set focus and automatically select all 1

Status
Not open for further replies.
awingnut

awingnut

Programmer
Feb 24, 2003
759
US
I have a text box and when I set focus() on that box I also want to select all so that what the user types replaces all of what is there before getting focus. Can someone tell me how? TIA.
 
Sort by date Sort by votes
likey so:

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]

<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
<!--

function attempt( el ) {
    var tr = el.createTextRange();
    tr.select();
}

-->
</script>
</head>

<body>

<form name="f">
    <input type="text" name="t" onfocus="attempt(this);" />
</form>

</body>
</html>

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote
Thanks for the reply.

I'm not sure why it should matter but I do the set focus in my function as well and when I add your code it doesn't work. I applied your suggestion by adding two lines of code:
Code: 
.
.
.
labelname.focus(); // This is the original set focus
var tr=labelname.createTextRange();
tr.select();
.
.
.
The cursor still correctly goes to the indicated text box but the contents are not selected.
 
Upvote 0 Downvote
Sure and thanks.
Code: 
<script language="JavaScript" type="text/javascript">
	function previous(labelname1,labelname2,use) {
	if (use) {
		labelname2.type="text";
		labelname1.style.display="inline";
		labelname2.focus();
		var tr=labelname2.createTextRange();
		tr.select();
		
	}
	else {
		labelname2.type="hidden";
		labelname1.style.display="none";
	}
	}
</script>
The body is pretty big. Do you need the call and associated HMTL tags as well?
 
Upvote 0 Downvote
Duh! [purpleface] Why didn't I think of looking there. Getting late in the day for me.

There was an error: createTextRange is not a function.

Now what?
 
Upvote 0 Downvote
As you can see labelname2 is set to type="text". It originally is an <input> field set to type="hidden". This function is executed when a radio button is clicked (onClick) that requires additional input from the user. The associated passed objects for the <label> (labelname1) and <input> (labelname2) are not displayed otherwise.
 
Upvote 0 Downvote
I thought I may have misunderstood your reference to type "text" so I tried the following:
Code: 
var tr=labelname2.value.createTextRange();
Of course that didn't work either. I read up on createTextRange() and I'm obviously missing something.
 
Upvote 0 Downvote

Are you using IE/Win? If not, you'll probably find that createTextRange will not work.

Hope this helps,
Dan


The answers you get are only as good as the information you give!

 
Upvote 0 Downvote

Nice... I had no idea that createTextRange was cross-browser. I'll remember that one.

Thanks!
Dan


The answers you get are only as good as the information you give!

 
Upvote 0 Downvote
Cross-browser, perhaps but it appears not cross-platform. I have Firefox as well but on OS X. I cannot get it to recognize createTextRange(). Assuming it is not supported on a Mac, does anyone have any alternative suggestions? TIA.
 
Upvote 0 Downvote
new function:

Code: 
function attempt( el ) {

    var ov, trs, tr;
    
    // browser determination
    var isOpera = navigator.userAgent.indexOf("Opera") > -1;
    var isIE = navigator.userAgent.indexOf("MSIE") > 1 && !isOpera;
    var isMoz = navigator.userAgent.indexOf("Mozilla/5.") == 0 && !isOpera;

    // get the form
    var f = document.forms['f'];
    
    if (isIE) {
        tr = el.createTextRange();
        tr.select();     
    } else if (isMoz) {
        el.setSelectionRange( 0, el.value.length);
    }
}

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote

Hmm.. why use createTextRange at all. This works for me:

Code: 
<input type="text" name="myText" onfocus="this.select();" />

Hope this helps,
Dan


The answers you get are only as good as the information you give!

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
997
Kennelbloke
Kennelbloke
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
666
Rayj0000
Rayj0000
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
774
lexer
lexer
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
714
rogerte
rogerte
markronz
  • Locked
  • Question
Javascript to edit all script tags 1
Replies
2
Views
330
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top