Focal Point Banner
Community Center Education Summit Technical Support User Groups
Let's Get Social!

Facebook Twitter LinkedIn YouTube
Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Alternating data row colors with CSS
Go
New
Search
Notify
Tools
Reply
  
[SOLVED] Alternating data row colors with CSS
 Login/Join
 
Silver Member
posted
Hello all,

I was hoping someone could point me in the right direction so I could learn how to use css to create alternate row colors within the data portion of a webfocus report.

Thanks for the help,
B

This message has been edited. Last edited by: Kerry,


WebFOCUS 7.7
Windows
All Output (Excel, HTML, PDF)
 
Posts: 31 | Location: Maryland, USA | Registered: April 30, 2010Reply With QuoteReport This Post
Platinum Member
posted Hide Post
I find it easier to let WebFocus handle the alternate row colors in the style sheet.

TYPE=DATA, BACKCOLOR=( 'WHITE' RGB(224 255 255) ), $

The line above alternates data rows with white and light cyan backgrounds.

Hope that helps,

Norb


prod:7.6.9, win2k3 mre, caster, bid, devstudio 7.6.9
 
Posts: 242 | Location: Minneapolis | Registered: February 16, 2006Reply With QuoteReport This Post
Silver Member
posted Hide Post
I agree, but I am using a css class with type=data so the line type=data,backcolor=... is ignored.


WebFOCUS 7.7
Windows
All Output (Excel, HTML, PDF)
 
Posts: 31 | Location: Maryland, USA | Registered: April 30, 2010Reply With QuoteReport This Post
Expert
posted Hide Post
Do it the old-fashioned way, with a flag or indicator:

TABLE FILE CAR
PRINT
COUNTRY CAR MODEL BODYTYPE

COMPUTE CLASSFLAG/A1 = IF CLASSFLAG EQ '' THEN '2' ELSE ''; NOPRINT

ON TABLE SET PAGE NOLEAD
ON TABLE SET STYLE *
TYPE=REPORT, SQUEEZE=ON, $
TYPE=DATA, CLASS=class2, WHEN= CLASSFLAG EQ '2', $
TYPE=DATA, CLASS=class1, WHEN= CLASSFLAG EQ '', $
ENDSTYLE

ON TABLE HOLD AS H001 FORMAT HTMTABLE
END
-RUN

-HTMLFORM BEGIN
<STYLE>
body { font-family: Arial, sans-serif; font-size: 12px; }
.class1 { background-color: yellow; }
.class2 { background-color: red; }
</STYLE>
!IBI.FIL.H001;
-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
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Reply With QuoteReport This Post
Silver Member
posted Hide Post
Thanks Francis,

Can you explain what !IBI.FIL.H001; means?


WebFOCUS 7.7
Windows
All Output (Excel, HTML, PDF)
 
Posts: 31 | Location: Maryland, USA | Registered: April 30, 2010Reply With QuoteReport This Post
Virtuoso
posted Hide Post
That's the way you insert the contents of your report (ON TABLE HOLD FORMAT HTMTABLE) into the HTMLFORM: !IBI.FIL.filename


Regards,

Darin



In FOCUS since 1991
WF Server: 7.7.04 on Linux and Z/OS, ReportCaster, Self-Service, MRE, Java, Flex
Data: DB2/UDB, Adabas, SQL Server Output: HTML,PDF,EXL2K/07, PS, AHTML, Flex
WF Client: 77 on Linux w/Tomcat
 
Posts: 2298 | Location: Salt Lake City, Utah | Registered: February 02, 2007Reply With QuoteReport This Post
Expert
posted Hide Post
!IBI.FIL.file-name;
drops the HOLD file into a HTMLFORM. How did you create the HOLD file and define the CSS classes?


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
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Reply With QuoteReport This Post
Silver Member
posted Hide Post
-HTMLFORM BEGIN
   <style>
     .Indent {
        padding-right: 28px;
    font-size: 8pt;
    font-family: Arial;
     }
   .NoIndent {
    font-size: 8pt;
    font-family: Arial;
 }
 .TotalIndent {
  padding-right: 28px;
    font-size: 8pt;
    font-family: Arial;
  font-weight:bold;
  border-top-style:solid;
  border-top-color:black;
  border-top-width:1px;
 )
   </style>
-HTMLFORM END

then use this line to reference...
ON TABLE SET CSSURL mycss.css

So you're saying I don't have to use that line?

Actually, I think I understand. It looks like you're creating the hold file first then passing that to an html form, where as I'm just embedding css into my focus code and referencing the css classes. Am I correct?
  
  
  
  
  
  

This message has been edited. Last edited by: bflemi3,


WebFOCUS 7.7
Windows
All Output (Excel, HTML, PDF)
 
Posts: 31 | Location: Maryland, USA | Registered: April 30, 2010Reply With QuoteReport This Post
Expert
posted Hide Post
Correct.


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
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Reply With QuoteReport This Post
Silver Member
posted Hide Post
Awesome, thanks Francis!

How can I learn more about incorporating html/javascript and style sheets into my focus code? Are there any websites/documentation/tutorials you're aware of?


WebFOCUS 7.7
Windows
All Output (Excel, HTML, PDF)
 
Posts: 31 | Location: Maryland, USA | Registered: April 30, 2010Reply With QuoteReport This Post
Virtuoso
posted Hide Post
That solution gets tedious (impossible?) once you're dealing with across-columns. I haven't found the correct way to deal with those yet, a suggestion would be appreciated.

In CSS3 you can use the new nth-child selector, eg:
tr:nth-child(odd) > td.data { background-color: yellow; }
tr:nth-child(even) > td.data { background-color: red; }


Unfortunately we use IE6...


WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :
 
Posts: 1644 | Location: Enschede, Netherlands | Registered: August 12, 2010Reply With QuoteReport This Post
Virtuoso
posted Hide Post
quote:
Originally posted by Wep5622:
That solution gets tedious (impossible?) once you're dealing with across-columns. I haven't found the correct way to deal with those yet, a suggestion would be appreciated.


Never mind, I just remembered there's ACROSSCOLUMN=...


WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :
 
Posts: 1644 | Location: Enschede, Netherlands | Registered: August 12, 2010Reply With QuoteReport This Post
  Powered by Social Strata  
 

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Alternating data row colors with CSS

Copyright © 1996-2018 Information Builders, leaders in enterprise business intelligence.