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 Chriss Miller 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
Joined
Feb 24, 2003
Messages
759
Location
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
are you getting errors? why are you setting the type of the value here? are there any other functions being called not listed here?

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
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 Question
Can't Get Markers to show on Map
Replies
0
Views
1K
Kennelbloke
Kennelbloke
Rayj0000
  • Locked
  • Question Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
842
Rayj0000
Rayj0000
lexer
  • Locked
  • Question Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
1K
lexer
lexer
rogerte
  • Locked
  • Question Question
Code that works on Windows, Android and Iphone
Replies
0
Views
896
rogerte
rogerte
markronz
  • Locked
  • Question Question
Javascript to edit all script tags
Replies
2
Views
466
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top