Build Form OTF (on the fly)

[Dave]

After much general searching, a JS newbie asks: can anyone point me to
where I can find out how to build a page (including form) using
Javascript? The reason I'd want to do this is because the page html is
becoming quite large due to form element attributes for each row of a
large form. I'm under the impression that I could condense this by
assigning variables to blocks of text that make up the page elements
and using script to write these elements to the window. Not only that,
but if I want to modify an attribute, I currently have to do it 25x
just for one column of the form. Being able to only modify a variable
once would propagate the change to the entire colum at least. Here's
an example of the length of just one table data tag (there are 5
similar tags per row):

<td width="72" align="center" height="22"><input type="text" READONLY
name="Item3" size="9" value="AS2K" style="height-style: 15;
text-align: Right; font-size: 8"></td>

I'm thinking that blocks of html such as everything in the above from
"<td" to "value=" could be one variable, and the "style=...8"> could
be another.
Would building the page using script be leaner?
Thanks,
Dave

 

[Richard Cornford]

<td width="72" align="center" height="22">

Every attribute in that tag can be replaced with separate CSS, the tag
doesn't even need a class or ID attribute as the CSS selector could be
context sensitive but even - class="colN" - would reduce the size of
that tag by 2/3.

<input type="text" READONLY
name="Item3" size="9" value="AS2K"
style="height-style: 15;text-align: Right; font-size: 8"></td>

And much the same can be said for this inline style attributes.

I'm thinking that blocks of html such as everything in the
above from "<td" to "value=" could be one variable, and the
"style=...8"> could be another.
Would building the page using script be leaner?

Of the many ways of approaching your problem JavaScript is probably the
worst. It looks like the appropriate application of CSS would nearly
half your pages size and move some of the attribute values to a
centralised location.

Having a complex form implies server-side scripting of some sort to
process the results so dynamically generating the page on the server
would be another option for inserting repetitive attribute values from a
common source. Though that would not reduced the download size in the
way that the appropriate use of CSS would.

Richard.

 

[Dave]

Every attribute in that tag can be replaced with separate CSS, the tag
doesn't even need a class or ID attribute as the CSS selector could be
context sensitive but even - class="colN" - would reduce the size of
that tag by 2/3.


And much the same can be said for this inline style attributes.


Of the many ways of approaching your problem JavaScript is probably the
worst. It looks like the appropriate application of CSS would nearly
half your pages size and move some of the attribute values to a
centralised location.

Having a complex form implies server-side scripting of some sort to
process the results so dynamically generating the page on the server
would be another option for inserting repetitive attribute values from a
common source. Though that would not reduced the download size in the
way that the appropriate use of CSS would.

Richard.

To be truthful, I know little about CSS, but I guess I'll have to read
up on it as it sounds like the most viable solution. Server side
scripting is less desireable since we are not processing the results
(as I think you have surmised) unless you mean validation. That we are
doing using a js file. Thanks for the advice. I intend to take it.