Focal Point
[SOLVED] How to display more that one AHTML report on a -HTMLFORM?

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

November 02, 2011, 06:02 PM
David Briars
[SOLVED] How to display more that one AHTML report on a -HTMLFORM?
The following code..
-* Environmental Settings.
-SET &FMT = 'HTML';
APP PREPENDPATH IBISAMP
-RUN
-* Run Report 1.
TABLE FILE GGSALES
"Report 1"
PRINT *
IF RECORDLIMIT EQ 50
ON TABLE HOLD AS HOLD1 FORMAT &FMT
END
-* Run Report 2
TABLE FILE GGPRODS
"Report 2"
PRINT *
IF RECORDLIMIT EQ 50
ON TABLE HOLD AS HOLD2 FORMAT &FMT
END
-RUN
-* Present Reports 1 and 2 to User.
-HTMLFORM BEGIN
<html>
<head>
<title>Report Output</title>
<style type="text/css">
 div.rpt
 {
  width:700px;
  height:220px;
  padding:10px;
  border:5px solid gray;
  margin:0px;
  overflow:auto;
}
</style>
</head>
-*
<body>
<div class="rpt">
 !IBI.FIL.HOLD1;
</DIV>
<BR>
<div class="rpt">
 !IBI.FIL.HOLD2;
</div>
</body>
</html>
-HTMLFORM END 

..renders a web page containing my two reports, each report rendering within a scrollable area.

If I change the format of each report from HTML to AHTML, I see the first report only.

Besides only seeing the first report, I also see JavaScript errors:
quote:
Message: 'T_cntl[...].isMergeReports' is null or not an object
Line: 5311
Char: 1
Code: 0

Message: 'TTablePRO.0' is null or not an object
Line: 52
Char: 1
Code: 0
Any ideas on how to render the second AHTML report?

This message has been edited. Last edited by: David Briars,




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster
November 02, 2011, 09:30 PM
njsden
When you create your HOLD files in HTMTABLE (which is the appropriate way to create content to later use in -HTLFORM via !IBI.FIL) the rendered document contains "proper" HTML code:

<html>
<head>
<title>Report Output</title>
<style type="text/css">
 div.rpt
 {
  width:700px;
  height:220px;
  padding:10px;
  border:5px solid gray;
  margin:0px;
  overflow:auto;
}
</style>
</head>
<body>
<div class="rpt">

<!-- Results of first HOLD file here!!! -->
<TABLE BORDER CELLPADDING=1>
<!-- ... stuff 1 ... -->
/TABLE>
</DIV>
<BR>
<div class="rpt">

<!-- Results of second HOLD file here!!! -->
<TABLE BORDER CELLPADDING=1>
<!-- ... stuff 2 ... -->
</TABLE>
</div>
</body>
</html>


Even when using HTML format on your HOLD files, the content is rendered fine in IE because it has more lenient rules but the result is not really a properly formed HTML document:

<html>
<head>
<title>Report Output</title>
<style type="text/css">
 div.rpt
 {
  width:700px;
  height:220px;
  padding:10px;
  border:5px solid gray;
  margin:0px;
  overflow:auto;
}
</style>
</head>
<body>
<div class="rpt">

<!-- Results of first HOLD file here!!! -->
<HTML>
<HEAD>
<META name="HandheldFriendly" content="True">
<META name="PalmComputingPlatform" content="True">
<TITLE>WebFOCUS Report</TITLE>
<BASE HREF="http://localhost:8080/approot/baseapp/">
<!-- ... more stuff here ... -->
</BODY>
</HTML>
</DIV>
<BR>
<div class="rpt">
 
<!-- Results of second HOLD file here!!! -->
<HTML>
<HEAD>
<META name="HandheldFriendly" content="True">
<META name="PalmComputingPlatform" content="True">
<TITLE>WebFOCUS Report</TITLE>
<BASE HREF="http://localhost:8080/approot/baseapp/">
</HEAD>
<BODY>
<TABLE BORDER CELLPADDING=1>
<!-- ... more stuff here ... -->
</BODY>
</HTML>
</div>
</body>
</html>


As you can see, there are 2 HTML documents "embedded" within the main <html> tags you created via -HTMLFORM. AS I said, IE is relatively lenient on this and renders the content without major hiccups.

AHTML is an entirely different animal which relies entirely on JavaScript and proper DOM objects. Attempting to put 2 or more AHTML reports inside of one <html> tag will not work, I guess, due to improper DOM elements and bad placement of <script> tags in the generated document.


The only way I know (although I have not tested it) to open multiple "HTML documents" in the same browser is by using IFRAME's so you may want to try that.



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
November 02, 2011, 09:46 PM
njsden
This is the best I could come up with but it may not be what you need:

ahtml_1.fex
-* Environmental Settings.
-SET &FMT = 'AHTML';
APP PREPENDPATH IBISAMP
-RUN
-* Run Report 1.
TABLE FILE GGSALES
"Report 1"
PRINT *
IF RECORDLIMIT EQ 50
ON TABLE PCHOLD FORMAT &FMT
END
-RUN



ahtml_2.fex
-* Environmental Settings.
-SET &FMT = 'AHTML';
APP PREPENDPATH IBISAMP
-RUN
-* Run Report 2
TABLE FILE GGPRODS
"Report 2"
PRINT *
IF RECORDLIMIT EQ 50
ON TABLE PCHOLD FORMAT AHTML
END
-RUN



And finally the piece that puts them together:

ahtml_multiple.fex
-HTMLFORM BEGIN
<html>
<head>
<title>Report Output</title>
<style type="text/css">
 #rpt1, #rpt2
 {
  width:700px;
  height:220px;
  padding:10px;
  border:5px solid gray;
  margin:0px;
  overflow:auto;
}
</style>
</head>
-*
<body>
<iframe id="rpt1" src="/ibi_apps/WFServlet?IBIF_ex=ahtml_1.fex"></iframe>
<br /><br />
<iframe id="rpt2" src="/ibi_apps/WFServlet?IBIF_ex=ahtml_2.fex"></iframe>
</body>
</html>
-HTMLFORM END



The last component could actually be an HTML document itself.



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
November 03, 2011, 09:42 AM
Ian Dalton
I couldn't get this to work - I simply replaced AHTML with HTML (the site I'm at doesn't have Active Reports). Just got 2 rectangular boxes with neither rpt1 nor rpt2 displayed. Also, is it possible to have 2 tabs rather than just the 2 reports stacked one after the other ? I just want to do what David was doing at the start of this thread but with a tab for each report.


_______________________
*** WebFOCUS 8.1.05M ***
November 03, 2011, 10:52 AM
<FreSte>
Hi,
I copied this example from "Developing Report Application".pdf

TABLE FILE GGSALES
SUM
DOLLARS
UNITS
BY REGION
BY ST
BY CITY
HEADING
"Regional Sales Summary"
ON TABLE HOLD AS REPORT1 FORMAT AHTMLTAB
END

TABLE FILE GGSALES
SUM
DOLLARS
UNITS
BY CATEGORY
BY PRODUCT
HEADING
"Production Order Summary"
ON TABLE HOLD AS REPORT2 FORMAT AHTMLTAB
END

-*
-HTMLFORM BEGIN
<HTML>
<HEAD>
<TITLE>Displaying HTML Active Reports on an HTML Web Page</TITLE>
</HEAD>
<BODY>!IBI.OBJ.ACTIVEREPORTJS;
<TABLE BORDER='1'>
<TR>
<TD valign=top>
!IBI.FIL.REPORT1;
</TD>
<TD valign=top>
!IBI.FIL.REPORT2;
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
-HTMLFORM END

November 03, 2011, 11:03 AM
njsden
quote:
FORMAT AHTMLTAB


Cool. That's a new one for me but it definitely makes sense to have an "Active" equivalence to HTMTABLE.

Thanks FreSte.



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
November 03, 2011, 11:29 AM
DavSmith
FreSte, nice catch!

Layout Composer is another answer for displaying 2 or more Active reports on one page. It can also be the answer for multi-tabbed reports and as a bonus add a Table of Contents control that will filter any combo of reports.

Here's an example screenshot built using the Layout Composer:


Here is the code behind the output:

-* File test2
-* Default Mode: ResourceLayout
SET HTMLARCHIVE=ON
COMPOUND LAYOUT PCHOLD FORMAT AHTML
UNITS=IN, $
OBJECT=TOC, NAME='text1', TEXT='Table of Contents', MARKUP=OFF, TOC-NUMBERING=ON, POSITION=(0.854 0.854), DIMENSION=(7.000 9.500),  color=RGB(0 0 0),   METADATA=' TOCTITLE: Table of Contents', $
SECTION=section1, LAYOUT=ON, METADATA='0.5^0.5^0.5^0.5^1', MERGE=AUTO, ORIENTATION=PORTRAIT, PAGESIZE=Letter,  $
PAGELAYOUT=1, NAME='Page 1', text='Page 1', TOC-LEVEL=1, BOTTOMMARGIN=0.5, TOPMARGIN=0.5, METADATA='BOTTOMMARGIN=0.5,TOPMARGIN=0.5,LEFTMARGIN=0,RIGHTMARGIN=0,', $
COMPONENT='report1', TEXT='report1', TOC-LEVEL=2, POSITION=(0.936 0.879), DIMENSION=(6.875 2.292), METADATA='Z-INDEX: 100; POSITION: absolute; WIDTH: 6.875in; HEIGHT: 2.292in; OVERFLOW: auto; TOP: 0.879in; LEFT: 0.936in', $
COMPONENT='report2', TEXT='report2', TOC-LEVEL=2, POSITION=(0.938 3.438), DIMENSION=(6.771 2.604), METADATA='Z-INDEX: 100; POSITION: absolute; WIDTH: 6.771in; HEIGHT: 2.604in; OVERFLOW: auto; TOP: 3.438in; LEFT: 0.938in', $
OBJECT=STRING, NAME='text2', TEXT='<center>Sample Page 1</center>', POSITION=(3.643 0.563), MARKUP=ON, WRAP=ON, DIMENSION=(1.144 0.208),  color=RGB(0 0 0),   METADATA='', $
PAGELAYOUT=2, NAME='Page 2', text='Page 2', TOC-LEVEL=1, BOTTOMMARGIN=0.5, TOPMARGIN=0.5, METADATA='BOTTOMMARGIN=0.5,TOPMARGIN=0.5,LEFTMARGIN=0,RIGHTMARGIN=0,', $
COMPONENT='report3', TEXT='report1', TOC-LEVEL=2, POSITION=(0.733 1.442), DIMENSION=(6.875 2.292), METADATA='Z-INDEX: 102; POSITION: absolute; WIDTH: 6.875in; HEIGHT: 2.292in; OVERFLOW: auto; TOP: 1.442in; LEFT: 0.733in', $
COMPONENT='report4', TEXT='report2', TOC-LEVEL=2, POSITION=(0.728 4.353), DIMENSION=(6.771 2.604), METADATA='Z-INDEX: 103; POSITION: absolute; WIDTH: 6.771in; HEIGHT: 2.604in; OVERFLOW: auto; TOP: 4.353in; LEFT: 0.728in', $
OBJECT=STRING, NAME='text3', TEXT='<center>Sample Page 2</center>', POSITION=(3.537 0.810), MARKUP=ON, WRAP=ON, DIMENSION=(1.146 0.208),  color=RGB(0 0 0),   METADATA='', $
END
SET COMPONENT='report1'
-*component_type report
TABLE FILE CAR
SUM
'CAR.BODY.SALES'
BY 'CAR.COMP.CAR'
BY 'CAR.CARREC.MODEL'
HEADING
"ACTIVE Test Report 1"
FOOTING
""
ON TABLE SET PAGE-NUM OFF
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT AHTML
ON TABLE SET HTMLCSS ON
ON TABLE SET STYLE *
UNITS=IN,
PAGESIZE='Letter',
SQUEEZE=ON,
ORIENTATION=PORTRAIT,
$
TYPE=REPORT,
GRID=OFF,
FONT='ARIAL',
SIZE=9,
LINES-PER-PAGE=10,
$
TYPE=TITLE,
STYLE=BOLD,
$
ENDSTYLE
END
SET COMPONENT='report2'
-*component_type report
TABLE FILE CAR
SUM
'CAR.BODY.SALES'
BY 'CAR.COMP.CAR'
BY 'CAR.BODY.BODYTYPE'
HEADING
"ACTIVE Report Test 2"
FOOTING
""
ON TABLE SET PAGE-NUM OFF
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT AHTML
ON TABLE SET HTMLCSS ON
ON TABLE SET STYLE *
UNITS=IN,
PAGESIZE='Letter',
SQUEEZE=ON,
ORIENTATION=PORTRAIT,
$
TYPE=REPORT,
GRID=OFF,
FONT='ARIAL',
SIZE=9,
LINES-PER-PAGE=10,
$
TYPE=TITLE,
STYLE=BOLD,
$
ENDSTYLE
END
SET COMPONENT='report3'
-*component_type report
TABLE FILE CAR
SUM
'CAR.BODY.DEALER_COST'
BY 'CAR.COMP.CAR'
BY 'CAR.CARREC.MODEL'
HEADING
"ACTIVE Test Report 3"
FOOTING
""
ON TABLE SET PAGE-NUM OFF
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT AHTML
ON TABLE SET HTMLCSS ON
ON TABLE SET STYLE *
UNITS=IN,
PAGESIZE='Letter',
SQUEEZE=ON,
ORIENTATION=PORTRAIT,
$
TYPE=REPORT,
GRID=OFF,
FONT='ARIAL',
SIZE=9,
LINES-PER-PAGE=10,
$
TYPE=TITLE,
STYLE=BOLD,
$
$
ENDSTYLE
END
SET COMPONENT='report4'
-*component_type report
TABLE FILE CAR
SUM
'CAR.BODY.DEALER_COST'
BY 'CAR.COMP.CAR'
BY 'CAR.BODY.BODYTYPE'
HEADING
"ACTIVE Report Test 4"
FOOTING
""
ON TABLE SET PAGE-NUM OFF
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT AHTML
ON TABLE SET HTMLCSS ON
ON TABLE SET STYLE *
UNITS=IN,
PAGESIZE='Letter',
SQUEEZE=ON,
ORIENTATION=PORTRAIT,
$
TYPE=REPORT,
GRID=OFF,
FONT='ARIAL',
SIZE=9,
LINES-PER-PAGE=10,
$
TYPE=TITLE,
STYLE=BOLD,
$
ENDSTYLE
END
COMPOUND END

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



In FOCUS since 1985 - WF 8.009/8.104 Win 8 Outputs: ALL of 'em! Adapters: Sql Server Teradata Oracle
November 04, 2011, 09:50 AM
David Briars
Thank you njsden, for clarifying that HTMTABLE is the better/more logical HOLD FORMAT to use, than HTML, given my example.

Thank you FreSte, for letting me know that IB had come out with AHTMLTAB, to share the spotlight, with its big brother AHTML.

I have incorporated this format into my scenario, and it is exactly what I needed.

Again, many thanks.

This message has been edited. Last edited by: David Briars,
November 08, 2011, 05:22 AM
Ian Dalton
Thanks all for your contributions but my original intention was to have a multi-tab HTML report (not Active as we are not licensed for that here) ie. tab1 has report1 and tab2 has report2 - similar to what can be done with FORMAT EXL2K OPEN (compound reports).


_______________________
*** WebFOCUS 8.1.05M ***
November 08, 2011, 08:58 AM
DavSmith
Ian, you are correct in that the technique I describe above for using the Layout Composer to easily create good looking multi-windowed reports with tabs and single filter controls will only work with Active technologies (AHTML, APDF, FLEX).

HTML/PDF formats will allow for stacked multiple windows but will not create the tabs nor the single drop-down sort filter. In place of the tabs, it creates a true Table of Contents which you can then click on to move to the appropriate window/page.

I'm not sure if later versions (7.7.03 / 8.0) of Layout Composer offer HTML as an output format with TABS.

I think your only option if you want TABS with HTML output reports is to manually embed a JavaScript library such as JQuery. You'll find other posts referenceing JQuery here on FocalPoint.



In FOCUS since 1985 - WF 8.009/8.104 Win 8 Outputs: ALL of 'em! Adapters: Sql Server Teradata Oracle
November 08, 2011, 09:53 AM
Ian Dalton
Many thanks Dave. Will go down the JaveScript route I think plus have a dig around FocalPoint.
Have you got an example where you create a true Table of Contents ? This may suffice with the users.


_______________________
*** WebFOCUS 8.1.05M ***
November 08, 2011, 10:38 AM
Tom Flynn
To do HTML TOC, I recall using these from a long time ago:

  
-TYPE WEBFOCUS CGIVAR IBIWF_mreports=INDEX
-TYPE ERBFOCUS CGIVAR IBIWF_index=OFF 


These are then placed at the top of each report and are links to the report itself...

-TYPE WEBFOCUS CGIVAR IBIWF_mprefix=Class Roll Report

Just another idea and way...

Tom


Tom Flynn
WebFOCUS 8.1.05 - PROD/QA
DB2 - AS400 - Mainframe
November 08, 2011, 11:14 AM
Ian Dalton
Great thanks Tom - works well.


_______________________
*** WebFOCUS 8.1.05M ***
November 08, 2011, 11:30 AM
DavSmith
Good stuff, Tom! I hadn't seen that before, but then I wasn't lookin'. Smiler

Ian, if you load the code sample I provided above into Layout Composer and change the output format to HTML or PDF and run it, it will automatially add the Table of Contents page that has hyperlinked contents that will take you to the specific page.



In FOCUS since 1985 - WF 8.009/8.104 Win 8 Outputs: ALL of 'em! Adapters: Sql Server Teradata Oracle
November 09, 2011, 12:05 PM
Ian Dalton
Meant to ask yesterday if the little TOC icon that appears when you do an ON TABLE PCHOLD FORMAT HTML BYTOC statement can be automatically opened and positioned in a specific place on the HTML page. I know you can double-click at the place you want it to be and viola but our users are saying it's too small and not obvious. I tend to agree with them....


_______________________
*** WebFOCUS 8.1.05M ***
November 09, 2011, 12:46 PM
DavSmith
Ian, here is a link to official 7.6 manual page on using the HTML TOC feature. Find it here.

This discusses 2 different ways to effect navigation through a TOC command.

1. Single/Multi level user movable TOC object with expand/contract tree display depending on number of sorts.
2. Single/Multi level stationary chained drop-downs in the report heading with the number again depending on number of sorts.

I don't believe you can change the initial placement of the TOC object icon but you can change the css styling of it. The link above tells you how.



In FOCUS since 1985 - WF 8.009/8.104 Win 8 Outputs: ALL of 'em! Adapters: Sql Server Teradata Oracle
November 10, 2011, 05:03 AM
Ian Dalton
Thanks Dave. I have seen the TOC part of the manual but alas no mention on the initial placement. Will stick to what we have but would have been nice.


_______________________
*** WebFOCUS 8.1.05M ***