Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #15084 > unrolled thread

submit()

Back to article view | Back to comp.lang.javascript

Contents

  submit() Swifty <steve.j.swift@gmail.com> - 2012-07-17 09:36 +0100
    Re: submit() Martin Honnen <mahotrash@yahoo.de> - 2012-07-17 11:45 +0200
      Re: submit() Tim Streater <timstreater@greenbee.net> - 2012-07-17 11:36 +0100
      Re: submit() Martin Honnen <mahotrash@yahoo.de> - 2012-07-18 19:12 +0200
    Re: submit() SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> - 2012-07-17 12:03 +0200
    Re: submit() "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2012-07-17 13:04 +0300
      Re: submit() Swifty <steve.j.swift@gmail.com> - 2012-07-17 14:51 +0100
        Re: submit() "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2012-07-18 09:09 +0300
          Re: submit() Swifty <steve.j.swift@gmail.com> - 2012-07-19 17:27 +0100

#15084 — submit()

I have a form which is built like this:

<FORM NAME=month METHOD=POST ACTION=xxxx>
<TABLE>
...
<TD onClick="submit()">...
</TABLE>
</FORM>

It works, i.e. the submit() does submit the form, in all browsers
except FireFox (both ESR 10 and 13.0.1)

If I change to onClick="document.month.submit()" then all of the
browsers work, including both of my FireFoxes.

In my brief research on "submit() not working firefox", the consensus
is to add at least the form name, so why do the other browsers allow
me to get away with a simple "submit()" (and what else could I be
submitting?)

Which of the following apply:

(a) I was wrong to omit the "document.month." from my submit() ?
(b) FireFox is in error by not actioning the unqualified submit() ?
(c) This is a grey area, and no one is strictly wrong ?
(d) Something else is going on ?

Could I have used "this" in this scenario? 

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

[toc] | [next] | [standalone]

#15085

Swifty wrote:
> I have a form which is built like this:
>
> <FORM NAME=month METHOD=POST ACTION=xxxx>
> <TABLE>
> ...
> <TD onClick="submit()">...
> </TABLE>
> </FORM>
>
> It works, i.e. the submit() does submit the form, in all browsers
> except FireFox (both ESR 10 and 13.0.1)
>
> If I change to onClick="document.month.submit()" then all of the
> browsers work, including both of my FireFoxes.
>
> In my brief research on "submit() not working firefox", the consensus
> is to add at least the form name, so why do the other browsers allow
> me to get away with a simple "submit()" (and what else could I be
> submitting?)
>
> Which of the following apply:
>
> (a) I was wrong to omit the "document.month." from my submit() ?
> (b) FireFox is in error by not actioning the unqualified submit() ?
> (c) This is a grey area, and no one is strictly wrong ?
> (d) Something else is going on ?

I think the scope chain between the browsers differs, if the 'submit' 
method works then the 'form' ancestor element of the 'td' cell is in the 
scope chain when the onclick event handler is executed, with 
Mozilla/Firefox it is not.
I think with Firefox/Mozilla you will only find the 'form' in the scope 
chain of event handler attributes set up on form controls (e.g. input, 
textarea, select).
As for the reason, this might be historically.
As for being a grey area, I think the HTML5 draft tries to define it, 
see http://www.w3.org/TR/html5/webappapis.html#events which says 
"Lexical Environment Scope

         Let Scope be the result of NewObjectEnvironment(the element's 
Document, the global environment).
         If the element has a form owner, let Scope be the result of 
NewObjectEnvironment(the element's form owner, Scope).
         Let Scope be the result of NewObjectEnvironment(the element's 
object, Scope).
" and http://www.w3.org/TR/html5/forms.html#form-associated-element 
which says "A number of the elements are form-associated elements, which 
means they can have a form owner and, to expose this, have a form 
content attribute with a matching form IDL attribute.

     button
     fieldset
     input
     keygen
     label
     object
     output
     select
     textarea
".

So based on that the Mozilla implementation seems to be right, the 'td' 
cell element is not a form associated element and that way any ancestor 
'form' does not belong into the scope chain. On the other hand HTML5 is 
a draft that tries to reconcile existing specifications and existing 
implementations and that way in this case perhaps the HTML5 draft simply 
favours the Mozilla implementation instead of other implementations.

> Could I have used "this" in this scenario?

No, at least not
   this.submit()
as that would look for a 'submit' method of the 'td' cell element.


-- 

	Martin Honnen --- MVP Data Platform Development
	http://msmvps.com/blogs/martin_honnen/

[toc] | [prev] | [next] | [standalone]

#15088

In article <50053431$0$6548$9b4e6d93@newsspool4.arcor-online.net>,
 Martin Honnen <mahotrash@yahoo.de> wrote:

> Swifty wrote:
> > I have a form which is built like this:
> >
> > <FORM NAME=month METHOD=POST ACTION=xxxx>
> > <TABLE>
> > ...
> > <TD onClick="submit()">...
> > </TABLE>
> > </FORM>
> >
> > It works, i.e. the submit() does submit the form, in all browsers
> > except FireFox (both ESR 10 and 13.0.1)
> >
> > If I change to onClick="document.month.submit()" then all of the
> > browsers work, including both of my FireFoxes.

I have found this useful information so thanks to swifty for raising the 
point and jukka, Stéphane, and Martin for responding.

-- 
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted"  --  Bill of Rights 1689

[toc] | [prev] | [next] | [standalone]

#15093

Martin Honnen wrote:
> Swifty wrote:
>> I have a form which is built like this:
>>
>> <FORM NAME=month METHOD=POST ACTION=xxxx>
>> <TABLE>
>> ...
>> <TD onClick="submit()">...
>> </TABLE>
>> </FORM>
>>
>> It works, i.e. the submit() does submit the form, in all browsers
>> except FireFox (both ESR 10 and 13.0.1)
>>
>> If I change to onClick="document.month.submit()" then all of the
>> browsers work, including both of my FireFoxes.
>>
>> In my brief research on "submit() not working firefox", the consensus
>> is to add at least the form name, so why do the other browsers allow
>> me to get away with a simple "submit()" (and what else could I be
>> submitting?)
>>
>> Which of the following apply:
>>
>> (a) I was wrong to omit the "document.month." from my submit() ?
>> (b) FireFox is in error by not actioning the unqualified submit() ?
>> (c) This is a grey area, and no one is strictly wrong ?
>> (d) Something else is going on ?
>
> I think the scope chain between the browsers differs, if the 'submit'
> method works then the 'form' ancestor element of the 'td' cell is in the
> scope chain when the onclick event handler is executed, with
> Mozilla/Firefox it is not.

I did some further testing with IE 9 and it seems in quirks mode it puts 
the 'form' ancestor element into the scope chain but with strict mode it 
does not.

-- 

	Martin Honnen --- MVP Data Platform Development
	http://msmvps.com/blogs/martin_honnen/

[toc] | [prev] | [next] | [standalone]

#15086

Le 17/07/12 10:36, Swifty a écrit :
> I have a form which is built like this:
>
> <FORM NAME=month METHOD=POST ACTION=xxxx>
> <TABLE>
> ...
> <TD onClick="submit()">...
> </TABLE>
> </FORM>
>
> It works, i.e. the submit() does submit the form, in all browsers
> except FireFox (both ESR 10 and 13.0.1)
>
> If I change to onClick="document.month.submit()" then all of the
> browsers work, including both of my FireFoxes.
>
> In my brief research on "submit() not working firefox", the consensus
> is to add at least the form name, so why do the other browsers allow
> me to get away with a simple "submit()" (and what else could I be
> submitting?)
>
> Which of the following apply:
>
> (a) I was wrong to omit the "document.month." from my submit() ?
> (b) FireFox is in error by not actioning the unqualified submit() ?

all mozilla's browsers do and did so (even Netscape at last century)
see bellow why

> (c) This is a grey area, and no one is strictly wrong ?
> (d) Something else is going on ?
>
> Could I have used "this" in this scenario?

you could use "this.form" with elements of the form
(a TABLE, a TD or even a P aren't elements of form)

ie :
	<form action="javascript:alert('ok')">
		<input onblur="this.form.submit()">
	</form>



What can work :

<FORM NAME="month" action="javascript:alert('vu')">
<TABLE style="font-weight:bold"><tr>
<td><input onclick="this.form.submit()" value="click me"></td>
<TD onClick="document.month.submit()" title="document.month">clic</td>
<TD onClick="var f = this.parentNode;
              while(f.tagName.toLowerCase()!='form') f=f.parentNode;
              f.submit()"
     title="f.parentNode">clac</td>
</tr></TABLE>
<span onclick="this.parentNode.submit()">cloc</span>
</FORM>


-- 
Stéphane Moriaux avec/with iMac-intel

[toc] | [prev] | [next] | [standalone]

#15087

2012-07-17 11:36, Swifty wrote:

> I have a form which is built like this:
>
> <FORM NAME=month METHOD=POST ACTION=xxxx>
> <TABLE>
> ...
> <TD onClick="submit()">...
> </TABLE>
> </FORM>
>
> It works, i.e. the submit() does submit the form, in all browsers
> except FireFox (both ESR 10 and 13.0.1)

It should not work - i.e., Firefox is correct -, because submit() is a 
property of the Form object, not global.

> If I change to onClick="document.month.submit()" then all of the
> browsers work, including both of my FireFoxes.

If JavaScript is enabled, that is. It is best to first consider using a 
normal submit button, possibly styled, rather than create a submit 
control of your own.

> In my brief research on "submit() not working firefox", the consensus
> is to add at least the form name, so why do the other browsers allow
> me to get away with a simple "submit()" (and what else could I be
> submitting?)

The consensus is questionable, as so often.

Browsers do odd things in trying to recover from errors.

It might be argued that error recovery is OK here, but it's really 
questionable. Programmers are not supposed to call methods of objects as 
if they were global, and if they do so, this may well reflect a design 
error that the programmer should be made aware of.

> Which of the following apply:
>
> (a) I was wrong to omit the "document.month." from my submit() ?
> (b) FireFox is in error by not actioning the unqualified submit() ?
> (c) This is a grey area, and no one is strictly wrong ?
> (d) Something else is going on ?

Well, (a) comes closest, but referring to a form by name is outdated. 
The id attribute is the modern way, for creating a unique identifier:

<form id="monthForm" ...>
...
onclick="document.getElementById('monthForm').submit()">

Alternatively, you could use

onclick="document.forms[0].submit()">

though it's a bit old-style, and it would make the code depend on the 
form being the first form on the page.

> Could I have used "this" in this scenario?

No, because "this" would refer to the node corresponding to the <td> 
element, and it has no "submit" method.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#15090

On Tue, 17 Jul 2012 13:04:18 +0300, "Jukka K. Korpela"
<jkorpela@cs.tut.fi> wrote:

>If JavaScript is enabled, that is. It is best to first consider using a 
>normal submit button, possibly styled, rather than create a submit 
>control of your own.

In my environment, I can assume that JavaScript is on, but I
appreciate the problems that will arise if it is off. This thread
started when the person who'd requested the page found that they
couldn't navigate it as they'd requested, exactly the same symptom.

The request was for a calendar, which I delivered as a simple HTML
table, with a cell for each day. A new entry for a particular day is
created by a click on the cell's background. I'm not certain, but I
suspect this more or less makes JavaScript mandatory. Perhaps there is
a CSS solution. That too can be turned off, but not by most of the
people who will be visiting my page.

I wonder if I can put my <TD> inside a <BUTTON></BUTTON> sequence?
That's bound to break some rule or other. And I still haven't
recovered from IE6's implementation of <BUTTON>!

>The id attribute is the modern way, for creating a unique identifier:
><form id="monthForm" ...>
>...
>onclick="document.getElementById('monthForm').submit()">

I was raised on:
<form name=monthForm ...>
...
onclick="document.monthForm.submit()">

... and somehow, I cannot see the id attribute as superior. It
certainly involves a lot more typing; something I'm not too good at.
It also rubs off the white lettering on my black keyboard, if I do too
much typing (I already seem to have two "F's, the other one being in
the sequence QWFRTY...)


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

[toc] | [prev] | [next] | [standalone]

#15092

2012-07-17 16:51, Swifty wrote:

> The request was for a calendar, which I delivered as a simple HTML
> table, with a cell for each day. A new entry for a particular day is
> created by a click on the cell's background. I'm not certain, but I
> suspect this more or less makes JavaScript mandatory.

It depends on the interpretation and context. If there are no other 
cells, you can make the input buttons cover the entire area of the cell.

> I wonder if I can put my <TD> inside a <BUTTON></BUTTON> sequence?

You can't, but you can use <td><input type=submit></td> with 
cellspacing=0 on the <table> element.

> And I still haven't
> recovered from IE6's implementation of <BUTTON>!

Me neither. But there's always <input type=submit>.

Of course, if you want nice square cells with no resemblance of a 
button, then you need something else. But you can style <input 
type=button> that way, e.g.

input[type=submit] {
    display: block;
    width: 3em;
    height: 3em;
    border: none;
}

I'm not saying that you shouldn't use <td onclick> or equivalent; just 
that it is possible to do things like clickable calendars so that clicks 
trigger form submission, thus providing a natural way to implement 
server-side backup for the functionality.

> I was raised on:
> <form name=monthForm ...>
> ...
> onclick="document.monthForm.submit()">
>
> ... and somehow, I cannot see the id attribute as superior.

It's more of a principle than practice. By essence, name attributes are 
for naming, allowing the same name to be assigned to several elements, 
whereas id attributes are unique by definition. It's not really the name 
but the type of the attribute that matters. In HTML, the id attribute is 
declared as ID, which means unique identifier, so an HTML validator will 
check for the uniqueness

> It certainly involves a lot more typing;

There's always jQuery, which lets you save several keystrokes at the 
cost of a few standard lines in your code as well as the overhead of 
loading and parsing the library file. :-) But seriously, you *could* 
e.g. slap just

<script src=
"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

into the <head> element and use

onclick = "$('#monthForm').submit()"

when you have <form id="monthForm">.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#15107

On Wed, 18 Jul 2012 09:09:57 +0300, "Jukka K. Korpela"
<jkorpela@cs.tut.fi> wrote:

>I'm not saying that you shouldn't use <td onclick> or equivalent; just 
>that it is possible to do things like clickable calendars so that clicks 
>trigger form submission, thus providing a natural way to implement 
>server-side backup for the functionality.

I wonder if I could overlay the table with a clickable ImageMap? If I
did everything in pixels, I could use the X/Y coordinates of the
IMAGEMAP to workout which cell the pointer was in.

This is just speculation; I'm still going with the JavaScript.

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

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web