Hi,

I'm gradually working through the (Part 109-945) O4W v9.2 Quick Start Guide (PDF) and also referring to the associated Reference Guide. I've done the CUSTOMERS maintenance form as per examples.

I've been creating webpages (without any associated database) for several years now, using tools like HTML, Cascading stylesheets (CSS), Javascript, and PHP. I have been an ARev programmer but had very very little to do with OpenInsight.

What I've seen so far with O4W is looking great!

My understanding is that with your O4W Form Defintion Wizard, in general terms, you are gathering all the "parameters" for the Form, storing these in an Linear Hash (OI) record, and then using that data to generate the webpage with its HTML and control its layout/style (using the HTML ).

These days, it is preferred that the style of a form or table (or webpage) be separated from the HTML and specified in an associated CSS file. So, rather than specifying repetitively in the HTML, table cell by table cell, a table row or column (or similar webpage element) is given a CLASS or ID name, and then the style info specific to that element and class/ID is given in the stylesheet.

So, can I ask, please:

In the Form Definition Wizard, on the Layout Tab (or similar), I would like to specify a CSS stylesheet, just like you allow us to specify the HTML 'template' used to base the generated webpage on.

Also, in the Form Definition Wizard, on the Edit/Display Tab (or a Tab of its own), I'd like to specify one or more of the attribute CLASS and/or ID names for any "element" on the generated HTML webpage, particularly or . If not the specific CLASS or ID, at least have some control or rules to define the naming convention.

At present, a whole lot of properties are being specified, repetitively, on this Edit/Display Tab – I'd like to specify them in a stylesheet, just once. But I need CLASS and ID information.

At present I do not know what the generated webpage HTML CLASSes or IDs are, or even if they are the same every time the form is run.

Without this CLASS and ID information, how can I create my stylesheet?

Hi, Susan. Thanks for taking a look at O4W. Glad you're enjoying it!

Your understanding of how the O4W Form Wizard works is correct; after gathering up all the information, it creates a record in the O4WINQUIRY table, and then - when the O4W_RUN_FORM routine is invoked - this record is processed to generate HTML, javascript, css, etc.

Indeed, O4W is designed to let you control your output through "normal" CSS practices. In terms of specifying a stylesheet (or multiple stylesheets), you would specify the stylesheet(s) you wished to apply to the O4W form directly in the template that you're using for that form. I had envisioned that you'd simply specify different "templates" that contained different stylesheets, if they needed to vary; but since consistent look and feel across the website is a desirable goal, I assumed that once you'd defined a template (and included the applicable style sheets), you'd use that same template (and stylesheet) across multiple forms.

Now, in terms of determining which classes and IDs the elements have - these are determined at run-time, and aren't fixed, but rather are based on the location within that O4WINQUIRY record of each field. And since everything is currently layed out as a table, there will be classes associated both with the table cell and the input control (if any). In fact, the cell contents are wrapped inside what we call in O4W a "section" (what you'd know in HTML as a div), so for every field we actually have a cell, a div, and then the input control. The ID for the cell that contains the field label is going to be "LABEL_", the ID for the div that contains the label is "LABELCELL_", the ID for the cell that contains the field value is "VALUE_", the ID for the div that contains the input control is "VALUECELL_", and finally the ID for the input control itself is "FIELD_", where is the number of the field in the O4WINQUIRY record.

For example, let's say you've got 4 fields defined for your form (let's say, "FNAME", "LNAME", "ADDRESS1", and "CITY") - these will be known internally in the form runner as field 1, 2, 3, and 4. So the cell for the label for the LNAME is LABELCELL_2, while the (presumable) text box for the CITY will have the ID FIELD_4.

Kind of confusing, but hopefully not _too_ illogical. And of course if these are MV fields, then there's extra "stuff" used to name each individual field (but that's beyond the scope of this posting…)

In terms of classes, the cell that surrounds the input control has the class "classCell", while the input control has the class "inputClass". Again using the above example, the FNAME field would have the class inputClass1.

I agree that it would be a good idea to have the option of specifying additional classes for each element, and it's something that may be in O4W 1.1 (currently in process). Of course, this functionality is already available if you build a 'custom' O4W routine using the O4W APIs, but that requires an additional programming commitment that you might not wish to make if the Form Wizard (and Report Wizard and Dashboard Wizard and Menu Wizard) meet, or can potentially meet, most of your requirements.

Hope that helps!

- Bryan Shumsky

Revelation Software

Hi Bryan,

Thanks for your reply. Most helpful.

I'm really interested in where you folk are taking this, since if the Form Wizard (to start with) can as you suggest, potentially meet most of my requirements, then I'm very very interested. I know that it really takes lots of time and tedium to create an HTML Form in a tabular layout – I've done it: price lists; order forms. And I've spent a lot of time learning how (and "borrowing" CSS ideas and info from people like Eric Meyer) to get them styled to my satisfaction. (Even looking back at that work now, I could still improve them!!)

So, if there is any possibility of helping / testing what you're building, count me in – I'm very interested.

Maybe our "definitions" / understandings differ, but I would be designing a website with one "template" that controls the HTML structure of the whole webpage (for all webpages), with general "appearance" styled in one site-wide stylesheet. Then extra stylesheets allowing for page-specific, or function-specific (eg Forms), or even data-table-specific styling.

In our company, we are very much into "do it once and do it correctly". We actively try to avoid repetition. We like "includes" / $INSERTs / Server Side Includes. We like wizards / skeletons / macros that are used to programmatically make our job simpler and easier AND that generate standard, consistent, always-work-first-time code, without typos, without missing bits, but with all the complicated bits specified correctly, AND knowing we don't have to remember how to do the rarer complicated bits – it's been done for us! And it will compile and work first time!

So I'm strongly in favour of shifting as much as possible of a webpage's appearance / style into a stylesheet. Then all you need specify are the CLASS/ID names. The result is that the size of the HTML page is smaller, it is quicker to generate, it is clearer to understand, and results in less "data" to transmit. When designing there is less to think about and less work to do, and it forces everyone to work the same way and produce a consistent product.

I would like to send you a picture of a form screen together with the HTML which generates it and CSS used to sytle it, to show how little HTML + CSS is required when stylesheets are fully used.

Is it possible, please, to have a direct line to you so that I can show you these examples which are similar to an O4W form, and how I achieved its style? Thanks.

View this thread on the forum...