Focal Point
Styling reports using CSS

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/2741006742

September 19, 2007, 10:13 AM
Micheal
Styling reports using CSS
Hello,

Does anyone know if its possible to get a css class in the table declaration. I'm using the WebFocus webservices to execute my reports so need to return everything as a HTMTABLE so I can then embed it into my .aspx page. The .aspx page is already using a css file for its styling so I would like to be able to place the styles for the returned WebFocus report in here too.

At the moment I'm doing the following:

-* File testCss.fex
TABLE FILE TENDERINFO
PRINT
QUOTEHEADERID AS 'Quote Header Id'
TENDERID AS 'Tender ID'
COMPANYNAME AS 'Company Name'
ON TABLE SET ACCESSIBLE '508'
ON TABLE SET PAGE-NUM OFF
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT HTMTABLE

ON TABLE SET STYLE *
TYPE=REPORT, CSSURL=noFile.css, $
TYPE=DATA, CLASS=tableData, $
ENDSTYLE
END

This is generating the following:














Quote Header Id

Tender ID

Company Name

1234567890

12345678

Company 1 Ltd


I want to be able to have no style information contained in the generated HTML at all. Ideally, I want it to look like this:













Quote Header IdTender IDCompany Name
123456789012345678Company 1 Ltd


I can then reference the table in my css file as follows:

.table1 {border: 1px solid #000;}
.table1 th {font-weight: bold;}
.table1 td {padding: 0.5em;}

Does anyone know if this is possible??

Thanks

Micheal
September 19, 2007, 10:16 AM
Micheal
Looks like I made a hash of posting. Hopefully this should show my code:

Generated code:

<TABLE BORDER CELLPADDING=1>
<TR>
<TH scope='col' ALIGN=RIGHT VALIGN=BOTTOM>
Quote Header Id</TH>
<TH scope='col' ALIGN=RIGHT VALIGN=BOTTOM>
Tender ID</TH>
<TH scope='col' VALIGN=BOTTOM>
Company Name</TH>
</TR>
<TR>
<TD CLASS='tableData' ALIGN=RIGHT>
1234567890</TD>
<TD CLASS='tableData' ALIGN=RIGHT>
12345678</TD>
<TD CLASS='tableData'>
Company 1 Ltd</TD>
</TR>
<TR>
</TABLE>


How I want it to be:

  
<TABLE class="table1">
<TR>
<TH scope='col'>Quote Header Id</TH>
<TH scope='col'>Tender ID</TH>
<TH scope='col'>Company Name</TH>
</TR>
<TR>
<TD>1234567890</TD>
<TD>12345678</TD>
<TD>Company 1 Ltd</TD>
</TR>
<TR>
</TABLE>


I can then reference the table in my css file as follows:

  
.table1 {border: 1px solid #000;}
.table1 th {font-weight: bold;}
.table1 td {padding: 0.5em;}

September 19, 2007, 10:38 AM
Francis Mariani
I don't think there's a way to completely eliminate styling when creating an HTMTABLE formatted output file.

I have done this to create an output file containing HTML TABLE rows:

TABLE FILE CAR
SUM
COMPUTE TRB/A4 = '<TR>';
COMPUTE TDB/A20 = '<TD CLASS=TABLEDATA>';
COUNTRY
COMPUTE TDE/A5 = '</TD>';
COMPUTE TDB/A20 = '<TD CLASS=TABLEDATA>';
SALES
COMPUTE TDE/A5 = '</TD>';
COMPUTE TRE/A5 = '</TR>';
BY COUNTRY NOPRINT
ON TABLE HOLD AS H001 FORMAT ALPHA
END
-RUN
-HTMLFORM BEGIN
<TABLE>
!IBI.FIL.H001;
</TABLE>
-HTMLFORM END



Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
September 20, 2007, 11:57 AM
Larry Doley
yep what you need to do is insert html code as part of the report. Just do it in the define.

Another thing I've done to add line by line highlighting is to write a post processing script that takes in the html page produced by webfocus and add whatever html I want prior to it being displayed.