Form element scope

[Steve]

Hi everyone,

I have a test page. When I press the button, it bring form.html,
which is fine.
When I press Enter key in the textbox, it gives me an error saying
this.form.cmd is not an object. But in the button, it used the code
this.form.cmd.v alue='dispense' . Why does it give me the error? I
think in a function, it should recognize the document, form and its
objects, should it?

Thank a lot.

Here is the page.
<form name="newRxForm " method="post" action="form.ht ml">
<input type="hidden" name="cmd" value="dispense ">

<script language='javas cript1.2' >

function microsoftKeyPre ss(upc) {
if (window.event.k eyCode == 13){
this.form.cmd.v alue="view";
f.submit();
}}

</script>
<input type="text" name="upc" value="upc"
onKeyPress="mic rosoftKeyPress( this.value)">
<input type="button" name="Submit3" value="Dispense " class="smallTex t"
onClick="this.f orm.cmd.value=' dispense';this. form.submit()">
</form>

[RobB]

Re: Form element scope

stevema1955@yah oo.com (Steve) wrote in message news:<cdb12bc2. 0412011425.2f65 9d4d@posting.go ogle.com>...[color=blue]
> Hi everyone,
>
> I have a test page. When I press the button, it bring form.html,
> which is fine.
> When I press Enter key in the textbox, it gives me an error saying
> this.form.cmd is not an object. But in the button, it used the code
> this.form.cmd.v alue='dispense' . Why does it give me the error? I
> think in a function, it should recognize the document, form and its
> objects, should it?
>
> Thank a lot.
>
> Here is the page.
> <form name="newRxForm " method="post" action="form.ht ml">
> <input type="hidden" name="cmd" value="dispense ">
>
> <script language='javas cript1.2' >
>
> function microsoftKeyPre ss(upc) {
> if (window.event.k eyCode == 13){
> this.form.cmd.v alue="view";
> f.submit();
> }}
>
> </script>
> <input type="text" name="upc" value="upc"
> onKeyPress="mic rosoftKeyPress( this.value)">
> <input type="button" name="Submit3" value="Dispense " class="smallTex t"
> onClick="this.f orm.cmd.value=' dispense';this. form.submit()">
> </form>[/color]

You've got two separate functions there: one (Button.onclick ) is
anonymous, a property of the "Submit3" Button object, the other is
global (microsoftKeyPr ess) and is a property of window. Two different
scopes - 'this' in a top-level function points to window, in a form
event handler property, to the element object it's a property of.

You've also passed an argument (upc) for no reason, and referenced the
form as 'f' with no supporting code. Also effectively disabled the
form completely for JS-disabled users.

[Steve]

Re: Form element scope

Thank you for the help. Could you give me more info?

I changed the code, but the line

this.document.f orm.cmd.value=" view";

still caused problem.

The next line this.document.f orm.cmd.submit( );

works. Why one worked, the other did not? You said "this" means
window object, didn't you?

In the code: onClick="this.f orm.cmd.value.. ., do you mean "this" refer
to the button? If this is what you mean, then "this.form.cmd. value"
does not make sense.

Here is the page.
<form name="newRxForm " method="post" action="form.ht ml">
<input type="hidden" name="cmd" value="dispense ">

<script language='javas cript1.2' >

function microsoftKeyPre ss() {
if (window.event.k eyCode == 13){
this.document.f orm.cmd.value=" view";
this.document.f orm.cmd.submit( );
}}

</script>
<input type="text" name="upc" value="upc"
onKeyPress="mic rosoftKeyPress( )">
<input type="button" name="Submit3" value="Dispense "
onClick="this.f orm.cmd.value=' dispense';this. form.submit()">
</form>

[RobB]

Re: Form element scope

stevema1955@yah oo.com (Steve) wrote in message news:<cdb12bc2. 0412021820.249e 1ebe@posting.go ogle.com>...[color=blue]
> Thank you for the help. Could you give me more info?
>
> I changed the code, but the line
>
> this.document.f orm.cmd.value=" view";
>
> still caused problem.
>
> The next line this.document.f orm.cmd.submit( );
>
> works. Why one worked, the other did not? You said "this" means
> window object, didn't you?
>
> In the code: onClick="this.f orm.cmd.value.. ., do you mean "this" refer
> to the button? If this is what you mean, then "this.form.cmd. value"
> does not make sense.
>
> Here is the page.
> <form name="newRxForm " method="post" action="form.ht ml">
> <input type="hidden" name="cmd" value="dispense ">
>
> <script language='javas cript1.2' >
>
> function microsoftKeyPre ss() {
> if (window.event.k eyCode == 13){
> this.document.f orm.cmd.value=" view";
> this.document.f orm.cmd.submit( );
> }}
>
> </script>
> <input type="text" name="upc" value="upc"
> onKeyPress="mic rosoftKeyPress( )">
> <input type="button" name="Submit3" value="Dispense "
> onClick="this.f orm.cmd.value=' dispense';this. form.submit()">
> </form>[/color]

You still haven't explained what you needed to do.

Never a good idea to make a form impossible to submit w/o JavaScript.

Try this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled </title>

<script type="text/javascript">
//<![CDATA[

function handle_keypress (e)
{
e = e || window.event; //get Event object
var kC = e.keyCode || e.which; //key code
if (e && kC && kC == 13) //enter key?
{
var tgt = e.srcElement || e.target; //'upc' field
if (tgt)
{
var f = tgt.form; //Form object
f.cmd.value = 'view'; //set flag
}
}
return true; //why not...
}

function handle_enter()
{
var el;
if (el = document.getEle mentById('upc') )
el.onkeypress = handle_keypress ;
}

onload = handle_enter;

//]]>
</script>
</head>
<body>
<form name="newRxForm " method="post" action="form.ht ml">
<input type="hidden" name="cmd" value="dispense ">
<input id="upc" type="text" name="upc" value="upc">
<input type="submit" name="Submit3" value="Dispense " class="smallTex t"
onClick="this.f orm.cmd.value=' dispense'">
</form>
</body>
</html>

Keep this in mind: embedding a script in the middle of a form doesn't
make it a part of the form. Different browsers will modify the scope
of varibles in such a script, but it's nothing to rely on. Always
treat them like separate entities.
[color=blue]
> In the code: onClick="this.f orm.cmd.value.. ., do you mean "this" refer
> to the button? If this is what you mean, then "this.form.cmd. value"
> does not make sense.[/color]

Sure it does.

this == Button
..form == form property, points to Form object (every form element has
one)
..cmd == hidden field of that name in form
..value == its value property

'this' in that other (stand-alone) function points to 'window', and a
window object has no .form property - what would it refer to if it
did? ;)

[RobB]

Re: Form element scope

ferndoc9@hotmai l.com (RobB) wrote in message news:<ab354593. 0412030117.70ef c963@posting.go ogle.com>...[color=blue]
> stevema1955@yah oo.com (Steve) wrote in message news:<cdb12bc2. 0412021820.249e 1ebe@posting.go ogle.com>...[color=green]
> > Thank you for the help. Could you give me more info?
> >
> > I changed the code, but the line
> >
> > this.document.f orm.cmd.value=" view";
> >
> > still caused problem.
> >
> > The next line this.document.f orm.cmd.submit( );
> >
> > works. Why one worked, the other did not? You said "this" means
> > window object, didn't you?
> >
> > In the code: onClick="this.f orm.cmd.value.. ., do you mean "this" refer
> > to the button? If this is what you mean, then "this.form.cmd. value"
> > does not make sense.
> >
> > Here is the page.
> > <form name="newRxForm " method="post" action="form.ht ml">
> > <input type="hidden" name="cmd" value="dispense ">
> >
> > <script language='javas cript1.2' >
> >
> > function microsoftKeyPre ss() {
> > if (window.event.k eyCode == 13){
> > this.document.f orm.cmd.value=" view";
> > this.document.f orm.cmd.submit( );
> > }}
> >
> > </script>
> > <input type="text" name="upc" value="upc"
> > onKeyPress="mic rosoftKeyPress( )">
> > <input type="button" name="Submit3" value="Dispense "
> > onClick="this.f orm.cmd.value=' dispense';this. form.submit()">
> > </form>[/color]
>
> You still haven't explained what you needed to do.
>
> Never a good idea to make a form impossible to submit w/o JavaScript.
>
> Try this:
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
> <head>
> <title>untitled </title>
>
> <script type="text/javascript">
> //<![CDATA[
>
> function handle_keypress (e)
> {
> e = e || window.event; //get Event object
> var kC = e.keyCode || e.which; //key code
> if (e && kC && kC == 13) //enter key?
> {
> var tgt = e.srcElement || e.target; //'upc' field
> if (tgt)
> {
> var f = tgt.form; //Form object
> f.cmd.value = 'view'; //set flag
> }
> }
> return true; //why not...
> }
>
> function handle_enter()
> {
> var el;
> if (el = document.getEle mentById('upc') )
> el.onkeypress = handle_keypress ;
> }
>
> onload = handle_enter;
>
> //]]>
> </script>
> </head>
> <body>
> <form name="newRxForm " method="post" action="form.ht ml">
> <input type="hidden" name="cmd" value="dispense ">
> <input id="upc" type="text" name="upc" value="upc">
> <input type="submit" name="Submit3" value="Dispense " class="smallTex t"
> onClick="this.f orm.cmd.value=' dispense'">
> </form>
> </body>
> </html>
>
> Keep this in mind: embedding a script in the middle of a form doesn't
> make it a part of the form. Different browsers will modify the scope
> of varibles in such a script, but it's nothing to rely on. Always
> treat them like separate entities.
>[color=green]
> > In the code: onClick="this.f orm.cmd.value.. ., do you mean "this" refer
> > to the button? If this is what you mean, then "this.form.cmd. value"
> > does not make sense.[/color]
>
> Sure it does.
>
> this == Button
> .form == form property, points to Form object (every form element has
> one)
> .cmd == hidden field of that name in form
> .value == its value property
>
> 'this' in that other (stand-alone) function points to 'window', and a
> window object has no .form property - what would it refer to if it
> did? ;)[/color]

Oops...don't forget to remove this from the submit button, else moz
will run it even when the enter key is used:

onClick="this.f orm.cmd.value=' dispense'"