OVER TABLE alignment problem

December 05, 2006, 12:07 AM

Hi,

I am using the OVER command to display the fields in vertical order in my table.I have used the
ON TABLE HOLD AS XYZ FORMAT HTML
command to displayed its value in
HTMLBEGIN
!IBI.FIL.XYZ;
HTMLEND

But the alignment of fields is not proper.The labels are displayed on the far left while the data is displayed on the far right.Also i needed to reduce the width of the table.Is there any way to achieve this.

Regards,
Aditya

December 05, 2006, 03:49 AM

Tony A

One method (amongst many) is that as your output is HTML you can use CSS either embedded in your HTMLFORM or by using an external CSS file.

T

December 05, 2006, 04:04 AM

Aditya

Thanks Tony,

Can you give me an example.

Aditya

December 05, 2006, 05:29 AM

Tony A

Ok, a quick example but I would advise you to have a look around for a good book on CSS or have a search on the web as there are some very good sites out there (there are equally some really bad ones as well!)

TABLE FILE CAR
 SUM RCOST AS 'Cost to End Buyer'
OVER DCOST AS 'Cost to Dealer'
OVER COMPUTE Profit/D9 = RCOST - DCOST; AS 'Profit'
BY COUNTRY
BY CAR
BY MODEL
ON TABLE SET PAGE-NUM NOPAGE
ON TABLE HOLD AS MYTABLE FORMAT HTMTABLE
ON TABLE SET STYLE *
TYPE=TITLE, COLUMN=RCOST,  CLASS=Title_Col1, $
TYPE=TITLE, COLUMN=DCOST,  CLASS=Title_Col2, $
TYPE=TITLE, COLUMN=Profit, CLASS=Title_Col3, $
TYPE=DATA, COLUMN=RCOST,  CLASS=Data_Col1, $
TYPE=DATA, COLUMN=DCOST,  CLASS=Data_Col2, $
TYPE=DATA, COLUMN=Profit, CLASS=Data_Col3, $
ENDSTYLE
END
-RUN

-HTMLFORM BEGIN
<html>
<head>
<title>CSS Example</title>
<style>
 .Title_Col1 {width:100px; font-family:Tahoma; font-size:8pt; font-weight:bold; color:#00ff00;
              background-color:#ffffff; text-align:left;}
 .Title_Col2 {width:120px; font-family:Arial; font-size:8pt; font-weight:bold; color:#0000ff;
              background-color:#ffffff; text-align:center;}
 .Title_Col3 {width:140px; font-family:Courier; font-size:8pt; font-weight:bold; color:#ff0000;
              background-color:#ffffff; text-align:right; border-style: NONE;}
 .Data_Col1 {width:100px; font-family:Tahoma; font-size:14pt; font-weight:bold; color:#00ff00;
             background-color:#ffffff; text-align:left;}
 .Data_Col2 {width:120px; font-family:Arial; font-size:12pt; font-weight:bold; color:#0000ff;
             background-color:#ffffff; text-align:center;}
 .Data_Col3 {width:140px; font-family:Courier; font-size:10pt; font-weight:bold; color:#ff0000;
             background-color:#ffffff; text-align:right; border-style: NONE;}
</style>
</head>
<body>
!IBI.FIL.MYTABLE;
</body>
</html>
-HTMLFORM END

Note that you can use the WebFOCUS stylesheet syntax to assign a CLASS to a particular column etc. and the CLASS relates to the section within the CSS style in the HTML.

Also note that you should use FORMAT HTMTABLE as opposed to FORMAT HTML as the HTMTABLE expects the main HTML tags to be supplied and therefore does not override the STYLE tags you include in your HTMLFORM.

If you run the above with FORMAT HTML then you will NOT see the CSS styling.

T

December 05, 2006, 06:08 AM

Aditya

Thanks tony.I will try it out and update you.

December 11, 2006, 11:29 PM

Aditya

Hi,

The problem has been resolved.

Thanx

In FOCUS since 1986	WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2
	WebFOCUS App Studio 8.2.06 standalone on Windows 10