Re: How do I make a form field take focus ?

#1

Aaron Gray wrote:

Quote:

I want to make a form field take focus ideally coded in the form :-
form method="post" action="index.php?action=newname"
input type="text" name="name" size="40" value="" /
input type="submit" name="submit" value="Create" /
/form

This is how I'd do it, using javascript: (I know of no simple HTML solution)

1. Add a name to your form: <form name=myform method=...
2. Add the following to give focus to your "name" field:

<SCRIPT>document.myform.name.focus()</SCRIPT>

In place of "document" you can use "this" if you prefer, because your
script is inside the document, so "this" knows where to operate.
The [name] in the script is the ["name"] from your type="text" control;
nothing to do with the "name" in "name=" found in both your controls. So
if you'd used [name="person"] your script would be
document.myform.person.focus(). The references are case sensitive, so
neither "Myform" nor "Name" would work in your script.

I don't know if there are any rules on where the SCRIPT should go. I put
it just after the form, or even inside the form. Nothing (other than
some of the people around here!) seems to care.

The script itself conforms to the mathematical condition of "necessary
and sufficient". It contains everything that is necessary to make it
work, and nothing that exceeds what is sufficient to make it work.

--
Steve Swift
http://www.swiftys.org.uk/swifty.html
http://www.ringers.org.uk

#2

Steve Swift wrote:

Quote:

Aaron Gray wrote:
I want to make a form field take focus ideally coded in the form :-
form method="post" action="index.php?action=newname"
* * <input type="text" name="name" size="40" value="" /
* * <input type="submit" name="submit" value="Create" /
/form

This is how I'd do it, using javascript: (I know of no simple HTML solution)

You're right, HTML only cannot achieve this.

Quote:

1. Add a name to your form: <form name=myform method=...

That is a possible way, but there is no need to give the form a name
(see further).

Quote:

2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT

I would avoid using 'name' as an element's name; at one point or
another it may interfere with the reserved word 'name'.

Quote:

In place of "document" you can use "this" if you prefer, because your
script is inside the document, so "this" knows where to operate.

I would always use 'document' (but that might be my personal
preference)

Quote:

The [name] in the script is the ["name"] from your type="text" control;
nothing to do with the "name" in "name=" found in both your controls. So
if you'd used [name="person"] your script would be
document.myform.person.focus(). The references are case sensitive, so
neither "Myform" nor "Name" would work in your script.

I don't know if there are any rules on where the SCRIPT should go. I put
it just after the form, or even inside the form.

Best practice is to do:

<body onLoad="document.forms[0].elements['myname'].focus()">

because onLoad is explicitly executed just after the whole page is
loaded.

Best practices in form referencing:
http://www.javascripttoolbox.com/bestpractices/#forms

--
Bart

#3

Bart Van der Donck wrote:

Quote:

Best practice is to do:
body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.

I can see that it is a good idea to give the element the focus after you
are sure that it is there to receive the focus.
On the other hand, from the "School of practical experience" I've never
seen that giving the element the focus from a script placed after the
end of the form causes any problems, and with some browsers allows the
user to start typing the instant the form appears, without having to
click in the focussed field.

This is the benefit of being two-faced - I can see both sides of arguments.

--
Steve Swift
http://www.swiftys.org.uk/swifty.html
http://www.ringers.org.uk

#4

Bart Van der Donck wrote:

Quote:

Steve Swift wrote:
2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT

The required `type' attribute is missing.

Quote:

[...]
In place of "document" you can use "this" if you prefer, because your
script is inside the document, so "this" knows where to operate.

I would always use 'document' (but that might be my personal
preference)

No, Steve's reasoning is wrong. `this' refers to the Activation Object.
That may or may not be the object that has `document' as its property.
Using `document' instead, the scope chain is traversed until for the first
object that has that property.

Quote:

I don't know if there are any rules on where the SCRIPT should go. I put
it just after the form, or even inside the form.

Best practice is to do:

body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.

Very true. Whereas `onLoad' should be `onload', as it is better for several
reasons I already mentioned before. And the reference worm should be at
least shortened; it would be necessary to determine whether focus() would be
successful.

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>

#5

[this supersedes my previous followup]

Bart Van der Donck wrote:

Quote:

Steve Swift wrote:
2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT

The required `type' attribute is missing.

Quote:

[...]
In place of "document" you can use "this" if you prefer, because your
script is inside the document, so "this" knows where to operate.

I would always use 'document' (but that might be my personal preference)

No, Steve's reasoning is wrong. `this' refers to the Activation Object.
That may or may not be the object that implements HTMLDocument or its
equivalent. Using `document' instead, the scope chain is traversed until
for the first object that has that property.

Quote:

I don't know if there are any rules on where the SCRIPT should go. I
put it just after the form, or even inside the form.

Best practice is to do:

body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.

Very true. Whereas `onLoad' should be `onload', as it is better for several
reasons I already mentioned before. And the reference worm should be at
least shortened; it would be necessary to determine whether focus() would be
successful.

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>

#6

Thomas 'PointedEars' Lahn said the following on 1/22/2008 7:09 AM:

Quote:

[this supersedes my previous followup]

Hmmm. makes me wonder why I worry with proof-reading and thinking
through what I post before I post it. I can just post all I want and
then just post and say "this supersedes....".

Quote:

Bart Van der Donck wrote:
Steve Swift wrote:
2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT

The required `type' attribute is missing.

That's nice[1]. Irrelevant as well.

<snipped useful information>

Quote:

I don't know if there are any rules on where the SCRIPT should go. I
put it just after the form, or even inside the form.
Best practice is to do:

body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.

Very true. Whereas `onLoad' should be `onload', as it is better for several
reasons I already mentioned before.

There is no difference in the two when it is in HTML code. I have
already explained that to you. No difference what-so-ever. Just
something you seem to prefer and want everybody else to do it Thomas'
way. It can be anything from onload to ONLOAD and as long as it is
spelled correctly, no browser *can* care because HTML is case insensitive.

Quote:

And the reference worm should be at least shortened;

"Reference worm"? Is that another Thomas-word?

Quote:

it would be necessary to determine whether focus() would be successful.

True, and we know that is impossible so it leaves a person wondering why
you would say it is necessary to determine something that is impossible
to determine.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

#7

Randy Webb wrote:

Quote:

Thomas 'PointedEars' Lahn said the following on 1/22/2008 7:09 AM:
Bart Van der Donck wrote:
Steve Swift wrote:
2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT
The required `type' attribute is missing.

That's nice[1]. Irrelevant as well.

It isn't, stupid.

Quote:

snipped useful information

I don't know if there are any rules on where the SCRIPT should go. I
put it just after the form, or even inside the form.
Best practice is to do:

body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.
Very true. Whereas `onLoad' should be `onload', as it is better for several
reasons I already mentioned before.

There is no difference in the two when it is in HTML code. I have
already explained that to you. No difference what-so-ever. Just
something you seem to prefer and want everybody else to do it Thomas'
way. It can be anything from onload to ONLOAD and as long as it is
spelled correctly, no browser *can* care because HTML is case insensitive.

I have pointed out before that HTML is not per se case-insensitive.
Regardless, I have explained why it is not merely my preference that
makes this suggestion a sound one. But you are too stupid to read,
let alone comprehend what was written.

Quote:

And the reference worm should be at least shortened;

"Reference worm"? Is that another Thomas-word?

It is yet another thing that you fail to understand.

Quote:

it would be necessary to determine whether focus() would be successful.

True, and we know that is impossible [...]

If you know that it is impossible, you have some unlearning to do, because
that is wrong.

PointedEars

#8

Thomas 'PointedEars' Lahn said the following on 1/22/2008 8:02 PM:

Quote:

Randy Webb wrote:
Thomas 'PointedEars' Lahn said the following on 1/22/2008 7:09 AM:
Bart Van der Donck wrote:
Steve Swift wrote:
2. Add the following to give focus to your "name" field:

SCRIPT>document.myform.name.focus()</SCRIPT
The required `type' attribute is missing.
That's nice[1]. Irrelevant as well.

It isn't, stupid.

Now I see the Thomas I am used to. When you get challenged on something,
you attack the person instead of the argument. Yep, that is classic
Thomas MO.

For the type attribute to be relevant to the question, the
inclusion/exclusion of it would have to make a difference to the
question. In this case, it has absolutely nothing to do with the
question and that makes it irrelevant to the question.

Quote:

snipped useful information

I don't know if there are any rules on where the SCRIPT should go. I
put it just after the form, or even inside the form.
Best practice is to do:

body onLoad="document.forms[0].elements['myname'].focus()"

because onLoad is explicitly executed just after the whole page is
loaded.
Very true. Whereas `onLoad' should be `onload', as it is better for several
reasons I already mentioned before.
There is no difference in the two when it is in HTML code. I have
already explained that to you. No difference what-so-ever. Just
something you seem to prefer and want everybody else to do it Thomas'
way. It can be anything from onload to ONLOAD and as long as it is
spelled correctly, no browser *can* care because HTML is case insensitive.

I have pointed out before that HTML is not per se case-insensitive.

HTML is case insensitive. Period.

Quote:

Regardless, I have explained why it is not merely my preference that
makes this suggestion a sound one. But you are too stupid to read,
let alone comprehend what was written.

More Thomas MO. Put me back in your kill-file. It makes it easier to
correct your babble that way.

Quote:

And the reference worm should be at least shortened;
"Reference worm"? Is that another Thomas-word?

It is yet another thing that you fail to understand.

And it might explain why I asked about it.

Quote:

it would be necessary to determine whether focus() would be successful.
True, and we know that is impossible [...]

If you know that it is impossible, you have some unlearning to do, because
that is wrong.

The last time you tried to post a script that would determine if an
element could be focused or not, it fell down on it's face. You have yet
to show any script that is capable of determining it. Until you, or
anybody else, does that, then it remains that you can't determine -
reliably - if an element can have focus or not.

<URL:
http://groups.google.com/group/comp.lang.javascript/browse_thread/thread/f527903d7395c18/82adf74745565ee0?lnk=gst&q=onload+form+focus#82adf 74745565ee0>

Is the thread where you were shown that your latest attempt was horribly
inadequate.

It is easy to prove me wrong though. Post a script that will determine
if an arbitrary form element can be focused or not.

<input type="text" onfocus="this.blur()" name="inputYouCantFocus">

Happy scripting!

Now, please, oh please, post your best effort to prove me wrong.
Otherwise, admit it can't be done and move on.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

#9

Randy Webb a écrit :

Quote:

It is easy to prove me wrong though. Post a script that will determine
if an arbitrary form element can be focused or not.

input type="text" onfocus="this.blur()" name="inputYouCantFocus"

There is too many way allowing us to hide and/or prevent the focus on an
element, let me add a few to the list.

1) the obvious <input type="hidden">

2) <input disabled="disabled">

3) <input style="opacity:0">

4) <input style="position:absolute;clip:rect(0,0,0,0)">

5)
<div style="overflow:hidden;width:0;height:0">
<input>
</div>

6)
<div style="position:absolute;z-index:1;width:300px;height:100px">
<input style="width:100px">
</div>
<div style="position:absolute;z-index:2;width:300px;height:100px;
background-color:red"></div>

7) with this one, the focus can occur only with a mouse. You got a
keyboard only, you are screwed and can't focus it at all. How a script
would be able to determine if the second input is focusable ?
<input>
<input tabindex="-1">

and many many more tricky ways to hide anything we want.

Quote:

Happy scripting!

--
laurent

#10

Laurent vilday said the following on 1/23/2008 8:29 AM:

Quote:

Randy Webb a écrit :
It is easy to prove me wrong though. Post a script that will determine
if an arbitrary form element can be focused or not.

input type="text" onfocus="this.blur()" name="inputYouCantFocus"

There is too many way allowing us to hide and/or prevent the focus on an
element, let me add a few to the list.

Look through the thread I posted a URL to. It has a lot of examples of
inputs that can't have focus.

Quote:

1) the obvious <input type="hidden"

2) <input disabled="disabled"

3) <input style="opacity:0"

4) <input style="position:absolute;clip:rect(0,0,0,0)"

5)
div style="overflow:hidden;width:0;height:0"
input
/div

6)
div style="position:absolute;z-index:1;width:300px;height:100px"
input style="width:100px"
/div
div style="position:absolute;z-index:2;width:300px;height:100px;
background-color:red"></div

7) with this one, the focus can occur only with a mouse. You got a
keyboard only, you are screwed and can't focus it at all. How a script
would be able to determine if the second input is focusable ?
input
input tabindex="-1"

and many many more tricky ways to hide anything we want.

style="visibility: none"
style="display: none"

But, just one is all it takes to show that you can't determine it with
script to prove that it is impossible.

I am curious to see his attempt at it. His last one failed miserably.
--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Re: How do I make a form field take focus ?

Javascript JavaScript language (comp.lang.javascript)

Re: How do I make a form field take focus ? - 01-22-2008 , 02:18 AM

Re: How do I make a form field take focus ? - 01-22-2008 , 04:16 AM

Re: How do I make a form field take focus ? - 01-22-2008 , 04:29 AM

Re: How do I make a form field take focus ? - 01-22-2008 , 07:06 AM

Re: How do I make a form field take focus ? - 01-22-2008 , 07:09 AM

Re: How do I make a form field take focus ? - 01-22-2008 , 03:30 PM

Re: How do I make a form field take focus ? - 01-22-2008 , 08:02 PM

Re: How do I make a form field take focus ? - 01-23-2008 , 07:16 AM

Re: How do I make a form field take focus ? - 01-23-2008 , 08:29 AM

Re: How do I make a form field take focus ? - 01-23-2008 , 11:35 AM