Register  |  Login

Question Details    

   Question

Time: 13:41 - Sep 05, 2006     Asked by: john2      Status: Answered      Points: 75   

How do I target a form text box when my page loads so the cursor is there at the start?

I have a page that has a username and password login, and I would like to have it so when the page loads the username text area is highlighted and the user can start typing text there right away without having to click in it. How is that accomplished?

Ask a New Question

Become a Quomon Expert

Current Categories

 

Other Questions Needing Answers


   

Answer Discussion
Answer Discussion
Answer Summaries
Answer Summary
 
In your <head> section add the script

<script type="text/javascript">
function setFocus()
{
document.getElementById("txtName").focus()
}
</script>

where "txtName" is the value in the name attribute of your text box.

and in your <body> tag add <body onload="setFocus()">


Hope this helps!

Cheers

Peter

Expert:

PeterNZ

Date:

Sep 05, 2006

Time:

22:17

 

Votes: Good (0) | Bad (0)
Login to rate this answer

I imagine that you either have a cms or a complex page, so an easier trick is to append a javascript to the very bottom of the page, something like this:

You will need to replace the text 'username' with the actual name of the your username input.

<script type="text/javascript">
var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; i++)
{
  if(inputs[i].name =='username')
  {
   inputs[i].focus();
  }
}

</script>


For a very simple working example, just save this below as a html file and load it in your local browser. Notice the location of the script after the body close and before the close of the html tag.

<html>
<body>
 <form>
  <input name="username" type="text" />
  <input name="password" type="text" />
  <input name="submit" type="submit" />
 </form>
</body>
<script type="text/javascript">
var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; i++)
{
  if(inputs[i].name =='username')
  {
   inputs[i].focus();
  }
}

</script>
</html>

Expert:

redcharcoal

Date:

Sep 08, 2006

Time:

10:51

 

Votes: Good (0) | Bad (0)
Login to rate this answer

Thanks guys, huge help.

Expert:

john2

Date:

Oct 04, 2006

Time:

14:07

 

Votes: Good (0) | Bad (0)
Login to rate this answer

Question Answered

This question has been answered, and points have been rewarded to the following experts:

PeterNZ: 50
redcharcoal: 25

You're welcome however to comment or give additional information or if you wish, you have the ability to write an Answer Summary for this question by clicking on the "Answer Summaries" Tab.

 
No summaries have been submitted yet. Want to be the first?



Respond to this question:

New User

  Email:

Upon submission of this form, you will automatically be registered as a Quomon user and we will send your login information to this address

Registered User

Username:

Password:


Forgotten Password

 

New User

  Email:

Upon submission of this form, you will automatically be registered as a Quomon user and we will send your login information to this address

Registered User

Username:

Password:


Forgotten Password

   

"Psst, Quomon is a great site. Pass it on."     Tell a Friend  |   Link To Us  |   Save to Delicious  |   Digg! Digg it


All Questions


Language Options

English:

www.quomon.com

Español:

www.quomon.es

Sponsors

Questions and Answers Software
Real Estate Postcards
Marketing Fulfillment