Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

one form per tr

3 views
Skip to first unread message

Denis McMahon

unread,
Jul 7, 2015, 2:03:05 PM7/7/15
to
Is it possible to do this?

Is form a valid child of table or tr elements, such that I can wrap all
the td within a row in a single form?

It seems somewhat counter intuitive to have to create one table per form
and then make a series of javascript calls to make the cells line up.

For example, I have a list of things, each of which has a few attributes,
which I wish to display as a table. However, I also wish to enable
actions on each thing using input elements in the table.

At the moment I have to prefix every input element with an identifier
that indicates which thing it refers to, so I have inputs named like
rename_thingname, newname_thingname, user_thingname etc, and submits
submit all the input fields in the table, and I then have to search
through and find the relevant ones to update.

It would simplify processing the submitted form (not to mention
generating it) if there was a mechanism to create one form per table row
wrapping the tds in the row.
--
Denis McMahon, denismf...@gmail.com

Barry Margolin

unread,
Jul 7, 2015, 2:33:59 PM7/7/15
to
In article <mnh462$aur$3...@dont-email.me>,
Denis McMahon <denismf...@gmail.com> wrote:

> Is it possible to do this?
>
> Is form a valid child of table or tr elements, such that I can wrap all
> the td within a row in a single form?

No.

>
> It seems somewhat counter intuitive to have to create one table per form
> and then make a series of javascript calls to make the cells line up.
>
> For example, I have a list of things, each of which has a few attributes,
> which I wish to display as a table. However, I also wish to enable
> actions on each thing using input elements in the table.
>
> At the moment I have to prefix every input element with an identifier
> that indicates which thing it refers to, so I have inputs named like
> rename_thingname, newname_thingname, user_thingname etc, and submits
> submit all the input fields in the table, and I then have to search
> through and find the relevant ones to update.
>
> It would simplify processing the submitted form (not to mention
> generating it) if there was a mechanism to create one form per table row
> wrapping the tds in the row.

What you can do is put the entire form in a single cell, and make all
the fields hidden except for the submit button. When you submit the
form, use Javascript to copy the values from the visible inputs in the
other cells in the same row into the hidden inputs in the form.

Or you could just use AJAX for the whole thing, so you don't need a real
HTML form.

--
Barry Margolin, bar...@alum.mit.edu
Arlington, MA
*** PLEASE post questions in newsgroups, not directly to me ***

Thomas 'PointedEars' Lahn

unread,
Jul 9, 2015, 4:11:53 AM7/9/15
to
Barry Margolin wrote:

> Denis McMahon <denismf...@gmail.com> wrote:
>> Is it possible to do this?
>>
>> Is form a valid child of table or tr elements, such that I can wrap all
>> the td within a row in a single form?
>
> No.

And <http://validator.w3.org/> shows this.

>> It seems somewhat counter intuitive to have to create one table per form
>> and then make a series of javascript calls to make the cells line up.
>>
>> For example, I have a list of things, each of which has a few attributes,
>> which I wish to display as a table. However, I also wish to enable
>> actions on each thing using input elements in the table.
>>
>> At the moment I have to prefix every input element with an identifier
>> that indicates which thing it refers to, so I have inputs named like
>> rename_thingname, newname_thingname, user_thingname etc, and submits
>> submit all the input fields in the table, and I then have to search
>> through and find the relevant ones to update.
>>
>> It would simplify processing the submitted form (not to mention
>> generating it) if there was a mechanism to create one form per table row
>> wrapping the tds in the row.
>
> What you can do is put the entire form in a single cell, and make all
> the fields hidden except for the submit button. When you submit the
> form, use Javascript to copy the values from the visible inputs in the
> other cells in the same row into the hidden inputs in the form.
>
> Or you could just use AJAX for the whole thing, so you don't need a real
> HTML form.

The recommended approach, however, is to put the “table” element(s) into (a)
“form” element(s) (“table” elements that belong to the same purpose should
be descendants of the same “form” element). It is recommended because it
works *everywhere* /and/ user experience can be improved with client-side
scripting (including "AJAX", actually meaning XMLHttpRequest [XHR] here) if
that works, too.

For example, with client-side scripting one can determine which controls in
the form have changed (most efficiently by keeping a registry of changes,
see the “change” event), intercept and prevent, if useful, the form
submission, and submit only the name-value pairs of the form controls that
have changed.

And there is no “javascript” or “Javascript”.


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> (404-comp.)

Jukka K. Korpela

unread,
Jul 9, 2015, 5:03:27 PM7/9/15
to
2015-07-07, 21:01, Denis McMahon wrote:

> Is it possible to do this?

Yes.

> Is form a valid child of table or tr elements, such that I can wrap all
> the td within a row in a single form?

No. But you can still do that. Browsers are forgiving, and this is
actually mandated in HTML5 Recommendation, in the parsing section:
http://www.w3.org/TR/html5/syntax.html#parsing-main-intable
It says that within a table element and not within an inner td element,
a <form> tag is an error, but it also specifies what happens.

Example:

<table border>
<form action="...">
<tr>
<td><input name=foo value=0>
<td><input type=submit>
</tr>
</form>
<form action="...i">
<tr>
<td><input name=bar value=42>
<td><input type=submit>
</tr>
</form>
</table>

The two forms act independently of each other. Yet the rows and cells
inside them are laid out as a single table.

The reality is somewhat more messy. If you look at the page in a
browser’s Developer Tools, you’ll see that there are actually two form
elements with empty content, each followed by a tr element. But the form
fields inside them associate with the table preceding them, so things
work as if the structure were like in the source code.

However, if you try to use e.g.
form { outline: solid red }
in CSS, it has no effect on rendering here. The reason is that the form
elements have empty content

> It seems somewhat counter intuitive to have to create one table per form
> and then make a series of javascript calls to make the cells line up.

You might consider using CSS to format them as a single table. This
approach has essential limitations, though.

Yet another approach is to make each row contain one cell containing a
form that has, say, just a submit button, and associated other fields
with that form using the form=... attribute, e.g.

<style>
form { margin: 0 } /* To remove default spacing below. */
</style>
<table border>
<tr>
<td><input name=foo value=0 form=f1>
<td>
<form id=f1 action="...">
<input type=submit >
</form>
<tr>
<td><input name=bar value=42 form=f2>
<td>
<form id=f2 action="...">
<input type=submit >
</form>
</table>

This is valid HTML5. However, the form=... attribute is not recognized
by old browsers, so on them, this does not work at all: the forms have
just the submit buttons, and no data is submitted.

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

Thomas 'PointedEars' Lahn

unread,
Jul 10, 2015, 8:10:11 PM7/10/15
to
Jukka K. Korpela wrote:

> 2015-07-07, 21:01, Denis McMahon wrote:
>> Is form a valid child of table or tr elements, such that I can wrap all
>> the td within a row in a single form?
>
> No. But you can still do that.

But you should not.

> Browsers are forgiving,

True. However, to keep the metaphor, their way of forgiveness differs.

> and this is actually mandated in HTML5 Recommendation, in the parsing
> section: http://www.w3.org/TR/html5/syntax.html#parsing-main-intable

Not all browsers currently in use implement HTML5, in particular not all
implement this part of the HTML5 Specification. Also, HTML5 is based on
WHATWG HTML which is based on the implementations of a few browser vendors –
*not* all of them.

In fact, as for HTML5 browsers, those whose vendors claim to implement it
actually implement WHATWG HTML or an HTML 5.1+ Working Draft which differs
from the HTML5 Specification in several ways (although maybe not in this
regard).

> It says that within a table element and not within an inner td element,
> a <form> tag is an error, but it also specifies what happens. […]

Error correction has been and still is is inconsistent among layout engines,
therefore among browsers. It is specified in HTML5 so that old, broken
documents can still be rendered, and the intention is that those are
rendered in the same way.

It is foolish to rely on it for new documents.


PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f806at$ail$1$8300...@news.demon.co.uk>

Jukka K. Korpela

unread,
Jul 11, 2015, 5:06:28 AM7/11/15
to
2015-07-11, 3:06, Thomas 'PointedEars' Lahn wrote:

> Jukka K. Korpela wrote:
>
>> 2015-07-07, 21:01, Denis McMahon wrote:
>>> Is form a valid child of table or tr elements, such that I can wrap all
>>> the td within a row in a single form?
>>
>> No. But you can still do that.
>
> But you should not.

Nobody really asked your opinion about it.

> Not all browsers currently in use implement HTML5, in particular not all
> implement this part of the HTML5 Specification.

As usual, your pointless lecture has no real connection with the
question asked, and you have no actual facts backing up your statement.

The complicated HTML5 rules for handling this kind of markup was written
to document what browsers traditionally do, in their tag soup processing.

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

Thomas 'PointedEars' Lahn

unread,
Jul 11, 2015, 5:14:29 AM7/11/15
to
Thomas 'PointedEars' Lahn wrote:

> Barry Margolin wrote:
>> Denis McMahon <denismf...@gmail.com> wrote:
>>> Is form a valid child of table or tr elements, such that I can wrap all
>>> the td within a row in a single form?
>> No.
>
> And <http://validator.w3.org/> shows this.

According to that site (if you run validation on an HTML5 document with it),
that interface should no longer be used for *HTML5* validation, but the “Nu
Html Checker” at

https://validator.w3.org/nu/

instead.


PointedEars
--
When all you know is jQuery, every problem looks $(olvable).

Thomas 'PointedEars' Lahn

unread,
Jul 11, 2015, 5:34:00 AM7/11/15
to
Jukka K. Korpela wrote:

> 2015-07-11, 3:06, Thomas 'PointedEars' Lahn wrote:
>> Jukka K. Korpela wrote:
>>> 2015-07-07, 21:01, Denis McMahon wrote:
>>>> Is form a valid child of table or tr elements, such that I can wrap all
>>>> the td within a row in a single form?
>>> No. But you can still do that.
>> But you should not.
>
> Nobody really asked your opinion about it.

Nobody needed to. This is Usenet. I am free to post my opinion at any
point.

>> Not all browsers currently in use implement HTML5, in particular not all
>> implement this part of the HTML5 Specification.
>
> As usual, your pointless lecture has no real connection with the
> question asked, and you have no actual facts backing up your statement.

It has everything to do with the question asked, and with what you wrote,
which included bad advice based on a fallacy in an answer to the question
asked.

> The complicated HTML5 rules for handling this kind of markup was written
> to document what browsers traditionally do, in their tag soup processing.

You are ignoring the already mentioned fact that that “what browsers
traditionally do” includes only those browsers produced by the vendors that
pushed the WHATWG and HTML5 specifications, and then only the versions that
were in use at the time of writing them. HTML is a moving target now, but
users do not move along as quickly. Neither can *responsible* Web authors,
particularly not in a commercial setting.

Markup should still be syntactically valid to reduce the risk of unwanted
rendering caused by inconsistent error correction among layout engines
(particularly between those that are claimed to support HTML5 and those that
do not); therefore there are markup validators *even and especially for
HTML5* provided *by the W3C*.


PointedEars
--
Danny Goodman's books are out of date and teach practices that are
positively harmful for cross-browser scripting.
-- Richard Cornford, cljs, <cife6q$253$1$8300...@news.demon.co.uk> (2004)
0 new messages