You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@ofbiz.apache.org by Anil Patel <an...@hotwaxmedia.com> on 2008/05/31 21:38:53 UTC
Layout Single forms without tables
Hi,
There has been some momentum recently to add Ajax/Effects goodies to
HTML rendered using Screen/Form widget. I think as a part of this
effort we should consider moving away from FORM Layout using html
tables. The form layout using flexible html structures like div and
CSS can be made look COOL easily.
Is this doable?
Anybody interested in giving implementation tips?
Regards
Anil Patel
Re: Layout Single forms without tables
Posted by Anil Patel <an...@hotwaxmedia.com>.
David,
Thanks for adding details. For more complex data entry forms like
customer, I like to use ftl because we can do Two column layout and
have Web Designer make it look the way customer may like most.
Let's say if Shipping and Billing address are shown side by side and I
want to hide Billing address if its same as shipping then it will be
easy (I think only possible) if layout was done using div's.
Regards
Anil Patel
On Jun 1, 2008, at 12:15 AM, David E Jones wrote:
>
> I still like the idea because these aren't really a "table" per-se,
> ie no natural columns and rows, just title and field sets. Some
> might want the title above the field instead of to its left. Others
> might want it below or to the right (because they are crazy I
> guess... ;) ). Some might want a simulation of 2 columns like I did
> on the newcustomer.ftl page, and others might want the field and
> title to be right next to eachother.
>
> The point is if we do it with CSS then people can choose and lay
> them out however they want, without changing the HTML that is
> produced.
>
> -David
>
>
> On May 31, 2008, at 5:03 PM, Adrian Crum wrote:
>
>> I remember CSS classes like col-row, col-left, col-right, etc.
>> Basically <tr> and <td> elements were replaced with <div class="col-
>> row"> and <div class="col-left"> - which made no sense at all. It
>> was a lot of markup to do nothing more than create a table.
>>
>> Table layout is NOT evil - it is ideal for laying out columns and
>> rows (like forms).
>>
>> CSS can be used to make tables look cool too. I'd rather see Ajax
>> efforts put into "smart" table headers that, when clicked, change
>> the sort order of the table.
>>
>> -Adrian
>>
>> David E Jones <jo...@hotwaxmedia.com> wrote:
>> I did some work on this years ago doing a "prototype" of sorts in the
>> newcustomer.ftl page. This is for single type forms only, as for list
>> and multi forms a CSS layout doesn't make sense (given the tabular
>> nature of that layout).
>>
>> The important CSS classes are form-row, form-label, and form-field.
>>
>> I don't know if this is the most elegant way to do it, but it seems
>> to
>> work pretty well and has been there for years. I believe the styles
>> are only in the ecommain.css file at the minute.
>>
>> -David
>>
>>
>> On May 31, 2008, at 1:38 PM, Anil Patel wrote:
>>
>>> Hi,
>>> There has been some momentum recently to add Ajax/Effects goodies
>>> to HTML rendered using Screen/Form widget. I think as a part of this
>>> effort we should consider moving away from FORM Layout using html
>>> tables. The form layout using flexible html structures like div and
>>> CSS can be made look COOL easily.
>>>
>>> Is this doable?
>>>
>>> Anybody interested in giving implementation tips?
>>>
>>> Regards
>>> Anil Patel
>>>
>>>
>>>
>>
>>
>>
>
Re: Layout Single forms without tables
Posted by Jacopo Cappellato <ja...@gmail.com>.
I think that the main goal of (html) tables is to render tabular data;
for this reason using them to render a list is fine, but we should
avoid (if possible) to use them to render forms of type "single".
Jacopo
On Jun 1, 2008, at 2:57 PM, Adrian Crum wrote:
> Having the form layout change like you suggested would be a cool
> feature. Couldn't we have a widget attribute that controls that, and
> still output a table? Something like field-label-orientation="top |
> bottom | reversed".
>
> -Adrian
>
> David E Jones <jo...@hotwaxmedia.com> wrote:
> I still like the idea because these aren't really a "table" per-se, ie
> no natural columns and rows, just title and field sets. Some might
> want the title above the field instead of to its left. Others might
> want it below or to the right (because they are crazy I guess... ;) ).
> Some might want a simulation of 2 columns like I did on the
> newcustomer.ftl page, and others might want the field and title to be
> right next to eachother.
>
> The point is if we do it with CSS then people can choose and lay them
> out however they want, without changing the HTML that is produced.
>
> -David
>
>
> On May 31, 2008, at 5:03 PM, Adrian Crum wrote:
>
>> I remember CSS classes like col-row, col-left, col-right, etc.
>> Basically and elements were replaced with and - which made no
>> sense at all. It
>> was a lot of markup to do nothing more than create a table.
>>
>> Table layout is NOT evil - it is ideal for laying out columns and
>> rows (like forms).
>>
>> CSS can be used to make tables look cool too. I'd rather see Ajax
>> efforts put into "smart" table headers that, when clicked, change
>> the sort order of the table.
>>
>> -Adrian
>>
>> David E Jones wrote:
>> I did some work on this years ago doing a "prototype" of sorts in the
>> newcustomer.ftl page. This is for single type forms only, as for list
>> and multi forms a CSS layout doesn't make sense (given the tabular
>> nature of that layout).
>>
>> The important CSS classes are form-row, form-label, and form-field.
>>
>> I don't know if this is the most elegant way to do it, but it seems
>> to
>> work pretty well and has been there for years. I believe the styles
>> are only in the ecommain.css file at the minute.
>>
>> -David
>>
>>
>> On May 31, 2008, at 1:38 PM, Anil Patel wrote:
>>
>>> Hi,
>>> There has been some momentum recently to add Ajax/Effects goodies
>>> to HTML rendered using Screen/Form widget. I think as a part of this
>>> effort we should consider moving away from FORM Layout using html
>>> tables. The form layout using flexible html structures like div and
>>> CSS can be made look COOL easily.
>>>
>>> Is this doable?
>>>
>>> Anybody interested in giving implementation tips?
>>>
>>> Regards
>>> Anil Patel
>>>
>>>
>>>
>>
>>
>>
>
>
>
>
>
Re: Layout Single forms without tables
Posted by Adrian Crum <ad...@yahoo.com>.
Having the form layout change like you suggested would be a cool feature. Couldn't we have a widget attribute that controls that, and still output a table? Something like field-label-orientation="top | bottom | reversed".
-Adrian
David E Jones <jo...@hotwaxmedia.com> wrote:
I still like the idea because these aren't really a "table" per-se, ie
no natural columns and rows, just title and field sets. Some might
want the title above the field instead of to its left. Others might
want it below or to the right (because they are crazy I guess... ;) ).
Some might want a simulation of 2 columns like I did on the
newcustomer.ftl page, and others might want the field and title to be
right next to eachother.
The point is if we do it with CSS then people can choose and lay them
out however they want, without changing the HTML that is produced.
-David
On May 31, 2008, at 5:03 PM, Adrian Crum wrote:
> I remember CSS classes like col-row, col-left, col-right, etc.
> Basically and elements were replaced with and - which made no sense at all. It
> was a lot of markup to do nothing more than create a table.
>
> Table layout is NOT evil - it is ideal for laying out columns and
> rows (like forms).
>
> CSS can be used to make tables look cool too. I'd rather see Ajax
> efforts put into "smart" table headers that, when clicked, change
> the sort order of the table.
>
> -Adrian
>
> David E Jones wrote:
> I did some work on this years ago doing a "prototype" of sorts in the
> newcustomer.ftl page. This is for single type forms only, as for list
> and multi forms a CSS layout doesn't make sense (given the tabular
> nature of that layout).
>
> The important CSS classes are form-row, form-label, and form-field.
>
> I don't know if this is the most elegant way to do it, but it seems to
> work pretty well and has been there for years. I believe the styles
> are only in the ecommain.css file at the minute.
>
> -David
>
>
> On May 31, 2008, at 1:38 PM, Anil Patel wrote:
>
>> Hi,
>> There has been some momentum recently to add Ajax/Effects goodies
>> to HTML rendered using Screen/Form widget. I think as a part of this
>> effort we should consider moving away from FORM Layout using html
>> tables. The form layout using flexible html structures like div and
>> CSS can be made look COOL easily.
>>
>> Is this doable?
>>
>> Anybody interested in giving implementation tips?
>>
>> Regards
>> Anil Patel
>>
>>
>>
>
>
>
Re: Layout Single forms without tables
Posted by David E Jones <jo...@hotwaxmedia.com>.
I still like the idea because these aren't really a "table" per-se, ie
no natural columns and rows, just title and field sets. Some might
want the title above the field instead of to its left. Others might
want it below or to the right (because they are crazy I guess... ;) ).
Some might want a simulation of 2 columns like I did on the
newcustomer.ftl page, and others might want the field and title to be
right next to eachother.
The point is if we do it with CSS then people can choose and lay them
out however they want, without changing the HTML that is produced.
-David
On May 31, 2008, at 5:03 PM, Adrian Crum wrote:
> I remember CSS classes like col-row, col-left, col-right, etc.
> Basically <tr> and <td> elements were replaced with <div class="col-
> row"> and <div class="col-left"> - which made no sense at all. It
> was a lot of markup to do nothing more than create a table.
>
> Table layout is NOT evil - it is ideal for laying out columns and
> rows (like forms).
>
> CSS can be used to make tables look cool too. I'd rather see Ajax
> efforts put into "smart" table headers that, when clicked, change
> the sort order of the table.
>
> -Adrian
>
> David E Jones <jo...@hotwaxmedia.com> wrote:
> I did some work on this years ago doing a "prototype" of sorts in the
> newcustomer.ftl page. This is for single type forms only, as for list
> and multi forms a CSS layout doesn't make sense (given the tabular
> nature of that layout).
>
> The important CSS classes are form-row, form-label, and form-field.
>
> I don't know if this is the most elegant way to do it, but it seems to
> work pretty well and has been there for years. I believe the styles
> are only in the ecommain.css file at the minute.
>
> -David
>
>
> On May 31, 2008, at 1:38 PM, Anil Patel wrote:
>
>> Hi,
>> There has been some momentum recently to add Ajax/Effects goodies
>> to HTML rendered using Screen/Form widget. I think as a part of this
>> effort we should consider moving away from FORM Layout using html
>> tables. The form layout using flexible html structures like div and
>> CSS can be made look COOL easily.
>>
>> Is this doable?
>>
>> Anybody interested in giving implementation tips?
>>
>> Regards
>> Anil Patel
>>
>>
>>
>
>
>
Re: Layout Single forms without tables
Posted by Adrian Crum <ad...@yahoo.com>.
I remember CSS classes like col-row, col-left, col-right, etc. Basically <tr> and <td> elements were replaced with <div class="col-row"> and <div class="col-left"> - which made no sense at all. It was a lot of markup to do nothing more than create a table.
Table layout is NOT evil - it is ideal for laying out columns and rows (like forms).
CSS can be used to make tables look cool too. I'd rather see Ajax efforts put into "smart" table headers that, when clicked, change the sort order of the table.
-Adrian
David E Jones <jo...@hotwaxmedia.com> wrote:
I did some work on this years ago doing a "prototype" of sorts in the
newcustomer.ftl page. This is for single type forms only, as for list
and multi forms a CSS layout doesn't make sense (given the tabular
nature of that layout).
The important CSS classes are form-row, form-label, and form-field.
I don't know if this is the most elegant way to do it, but it seems to
work pretty well and has been there for years. I believe the styles
are only in the ecommain.css file at the minute.
-David
On May 31, 2008, at 1:38 PM, Anil Patel wrote:
> Hi,
> There has been some momentum recently to add Ajax/Effects goodies
> to HTML rendered using Screen/Form widget. I think as a part of this
> effort we should consider moving away from FORM Layout using html
> tables. The form layout using flexible html structures like div and
> CSS can be made look COOL easily.
>
> Is this doable?
>
> Anybody interested in giving implementation tips?
>
> Regards
> Anil Patel
>
>
>
Re: Layout Single forms without tables
Posted by David E Jones <jo...@hotwaxmedia.com>.
I did some work on this years ago doing a "prototype" of sorts in the
newcustomer.ftl page. This is for single type forms only, as for list
and multi forms a CSS layout doesn't make sense (given the tabular
nature of that layout).
The important CSS classes are form-row, form-label, and form-field.
I don't know if this is the most elegant way to do it, but it seems to
work pretty well and has been there for years. I believe the styles
are only in the ecommain.css file at the minute.
-David
On May 31, 2008, at 1:38 PM, Anil Patel wrote:
> Hi,
> There has been some momentum recently to add Ajax/Effects goodies
> to HTML rendered using Screen/Form widget. I think as a part of this
> effort we should consider moving away from FORM Layout using html
> tables. The form layout using flexible html structures like div and
> CSS can be made look COOL easily.
>
> Is this doable?
>
> Anybody interested in giving implementation tips?
>
> Regards
> Anil Patel
>
>
>