View Full Version : Javascript - Focus on input field on page load

05-29-2010, 06:05 PM
First off, I in 'no' way take credit for writing this script. I just found it on 'google'. (Sorry, I can't remeber where.).

What I did was took the javascript and made a super simple function out of it, to save typing so you can use it on all your pages you want. Sorry, I don't have an example of this, I don't have hosting for my engine (yet). So I have nothing online to show this. I made this for my engine. But it's just a function so it will work on anything..

Here is the function (Don't talk bad about it. It's VERY simple, not complex. I Know that there are lots of ways of doing this.).

function focus'$form,$input)
echo '<script type="text/javascript" language="JavaScript">';
echo "document.forms['".$form."'].elements['".$input."'].focus();";
echo '</script>';

Now it used in action. (Just an example so please don't pick at it. or try to talk bad about it.

echo '
<form action="PAGENAME" method="post" name="form_name_here">
<input type="text" name="input_name" value="Nothing" />
<input type="submit" value="Do It" />
//Now we use the function.
//Yes it MUST be AFTER the FROM! <-- Very important or it will not work.
//First name is forms name. <-- In example it is (form_name_here)
//Second is the Inputs name that you want it to put the cursor on when loaded. <-- In example it is (input_name)
//Now, when they load the page it will put the cursor in that input everytime :)

Hope you enjoy, yeah I know this is really nothing special. But I'm sure there are lots of people like me that are lazy :P. I use stuff like this all the time to save typing.
I'm sure everyone is going to say how they would have done it, lol..

But that is ok :thumbsup:

05-29-2010, 06:35 PM
Nice one AlabamaHit strangely enough I've not thought about doing this (perhaps when you hit the homepage username is focussed.. Good find :thumbsup: )

05-29-2010, 06:43 PM
Yeah on the engine I'm working on, I'm making the page focus on the first input on any page that has an input..

So, if using mccodes, I would agree completely, pages like login, register, bank, home page(index) focus on notepad, etc...

In mccodes I would put it in the global function page, But if using on login, you will have to put it on the page. So really wouldn't need the functnion. Just adding the javascript itself to pages like that.

05-29-2010, 06:46 PM
Yeah it's really the simple things that count I'll be using this for sure thanks again :)

05-29-2010, 06:49 PM
No problem, glad you like it.

I was hoping that people would find it useful. :)

05-30-2010, 12:31 AM
I'm sure others will be using it just not acknowledging the poster (normal XD)

05-30-2010, 12:46 AM
Yeah your probarly right, lol.

05-30-2010, 12:52 AM
Yeah :P

Maybe we should create a whole topic on helpfull snippets and sticky it for future reference (just throwing out ideas here :P )

05-30-2010, 07:10 PM
I like it. Will use it.


05-30-2010, 07:22 PM
This is just accessibility enhancement to a website, there are allot of other factors that one has to look at.
From simple tab indexes to accessibility for colour blind people, and even people who are deaf.

05-30-2010, 07:25 PM
Yup exactly. Just makes it quicker and easier, because it loads you in the field your typing in already. (Also, remeber, I just found the code online. I didn't write it up. Just made a function out of it.)