Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only.

Join the TIBCO Community
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community.


Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] How to use jQuery Datatables to load huge Webfocus output

Read-Only Read-Only Topic
Go
Search
Notify
Tools
[SOLVED] How to use jQuery Datatables to load huge Webfocus output
 Login/Join
 
Mathangi
Member
posted
Hello

I am having a table output which returns 1000 records. Business case is I have to show the output on browser page only, and hence I am loading the output in a IFRAME in my HTML page.

I happened to come across jquery's and its Datatables, which pulls in data during the scroll and hence reduces the burden on the browser page. Does anyone have any ideas / samples on how to use juery Datatables with WebFOCUS output. Thanks!

This message has been edited. Last edited by: <Kathryn Henning>,


WebFOCUS 7703, Unix, Excel, HTML, PDF
 
Posts: 4 | Registered: December 10, 2012Report This Post
BI_Developer
Platinum Member
posted Hide Post
I haven't worked on this. But for 1000 records, I don't think it would be a burden for the browser to display.


WF 8.2.01 APP STUDIO
PDF,HTML,EXL2K,Active
 
Posts: 139 | Registered: July 21, 2011Report This Post
Mathangi
Member
posted Hide Post
Hello BI_Developer

You are right, for 1000 records its not a burden. I referred that as a sample, however when the number is really huge say 10K on a HTML. Also I found there are many features in datatables like pagination, search option etc., which are easy to implement and also benefits the user more.


WebFOCUS 7703, Unix, Excel, HTML, PDF
 
Posts: 4 | Registered: December 10, 2012Report This Post
Severus.snape
Platinum Member
posted Hide Post
Hi,

You can use WEBVIEWER feature in WF for this purpose...it pretty much does what you want -- pagination.

thanks
Sashanka


WF 7.7.03/Windows/HTML,PDF,EXL
POC/local Dev Studio 7.7.03 & 7.6.11
 
Posts: 103 | Registered: June 12, 2009Report This Post
Francis Mariani
Expert
posted Hide Post
Here is a working example of WebFOCUS (using the CAR file) and jQuery Datatables. Datatables can be fed data in many ways, I chose a JavaScript array in this example.

I'll let you decipher the code. The two files can be put in any app folder - just change the HTMLFORM app reference (currently baseapp).

datatables1.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" type="image/ico" href="http://www.sprymedia.co.uk/media/images/favicon.ico" />

<title>WebFOCUS/DataTables</title>

<style type="text/css" title="currentStyle">
    @import "http://www.datatables.net/release-datatables/media/css/demo_page.css";
    @import "http://www.datatables.net/release-datatables/media/css/demo_table.css";
</style>

<script type="text/javascript" language="javascript" src="http://www.datatables.net/release-datatables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="http://www.datatables.net/release-datatables/media/js/jquery.dataTables.js"></script>

<script type="text/javascript" charset="utf-8">
/* Data set - can contain whatever information you want */
var aDataSet = [

!IBI.FIL.HDATA1;

];

$(document).ready(function() {
    $('#dynamic').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>' );
    $('#example').dataTable( {
        "aaData": aDataSet,
        "aoColumns": [
            { "sTitle": "Country" },
            { "sTitle": "Car" },
            { "sTitle": "Model" },
            { "sTitle": "Sales" },
            { "sTitle": "Weight" }
        ]
    } );
} );
</script>

</head>

<body id="dt_example">

<div id="container">
    <div id="dynamic"></div>
</div>

</body>

</html>


datatables1.fex
SET BYDISPLAY=ON
SET HOLDLIST=PRINTONLY
SET HOLDFORMAT=ALPHA
SET CENT-ZERO=ON
-RUN

TABLE FILE CAR
SUM
COMPUTE ROWCOUNT/P6 = ROWCOUNT + 1; NOPRINT

COMPUTE COMMA/A1 = IF ROWCOUNT EQ 1 THEN '' ELSE ',';

COMPUTE JS_ARRAY_VALUES/A500 =
'["' || COUNTRY || '","' ||
        CAR || '","' ||
        MODEL || '","' ||
        TRIM('L', FPRINT(SALES,'D6','A10'), 10, ' ', 1, 'A10')  || '","' ||
        TRIM('L', FPRINT(WEIGHT,'D6','A10'), 10, ' ', 1, 'A10') || '"]';

BY COUNTRY NOPRINT
BY CAR NOPRINT
BY MODEL NOPRINT

ON TABLE HOLD AS HDATA1
END
-RUN

-HTMLFORM baseapp/datatables1.htm


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, 2005Report This Post
Francis Mariani
Expert
posted Hide Post
Of course, this probably does not answer the "huge" question. If the data is "huge", then it probably shouldn't be displayed in HTML at all, or, as Sashanka suggests, use WebFOCUS On-Demand Paging (WEBVIEWER):

Creating Reporting Applications With Developer Studio > Viewing and Printing Reports and Graphs > Navigating Through Multi-Page Web Reports


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, 2005Report This Post
Alex
Platinum Member
posted Hide Post
You could also use a nested Table of Contents to navigate through large sets.


WF 7.7.04, WF 8.0.7, Win7, Win8, Linux, UNIX, Excel, PDF
 
Posts: 175 | Location: Pomona, NY | Registered: August 06, 2003Report This Post
Helper
Member
posted Hide Post
I had this issue a few months ago. The plugin JQgrid handles a large volume of data without performance hit.


WebFOCUS release 7
OS/Windows
html
 
Posts: 8 | Registered: April 30, 2013Report This Post
webfocusguru
Member
posted Hide Post
Mathangi, which browser & version is being used?


------------------------------
WebFOCUS 8.2.x, InfoAssist, MRE/Dashboard, ReportCaster, Active Reports, jQuery, Highcharts, FusionCharts
Platform: Windows, AIX
 
Posts: 11 | Location: Texas, USA | Registered: November 06, 2007Report This Post
Mathangi
Member
posted Hide Post
Hello Francis

This worked perfect. Thanks much!

Mathangi


WebFOCUS 7703, Unix, Excel, HTML, PDF
 
Posts: 4 | Registered: December 10, 2012Report This Post
Mathangi
Member
posted Hide Post
Solved!


WebFOCUS 7703, Unix, Excel, HTML, PDF
 
Posts: 4 | Registered: December 10, 2012Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] How to use jQuery Datatables to load huge Webfocus output

Copyright © 1996-2020 Information Builders