This HOWTOAJAX utility features a tool - Page-Load-Engine (PLE) - that makes use of JQuery Ajax rather simple.
The nice of it is that
you can use it both in static HTML pages and in dynamic HTML pages generated by CGIDEV2-based programs
you do not even need to know the JQuery language, as JQuery is hidden under the covers.
Just to see how it works, click one of the following buttons:
2- How to use it
Follow the following steps:
Include JQuery in your HTML page
Do that by entering the following command in your HTML (recommended location: between the <head> and the </head> tags: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
Include the PLE tool in your HTML page
Do the following in your HTML page:
If yourHTML page is a static one
Make sure that Server-Side-Include (SSI) is supported by your HTTP instance.
In your instance configuration file, the directive Options must specify the Includes option. Example: Options +ExecCGI -FollowSymLinks -SymLinksIfOwnerMatch +Includes -MultiViews -Indexes
In your HTML page (recommended location: just before the </body> and </html> tags)
insert the following command to include the PLE tool: <!--#include virtual="/howtoajax/html/PLEpageload.htm" -->
If your HTML page is generated by a CGIDEV2-based program
Have your CGI program loading also the external IFS stream file /howtoajax/html/PLEpageloadCGI.htm .
D extHtml s 2000 inz('/mydir/myfile.htm +
Have your CGI program issuing the following HTML section before that the tags </body> and </html>
Please note that file /howtoajax/html/PLEpageloadCGI.htm uses section name prefix <as400>.
This will cause problems in your CGI programs using a different section name prefix (example </$>),
as all HTML sections must have the same section name prefix.
The suggested way out is to change your section names to prefix <as400>.
To load an Ajax page, you need to call some procedure of yours that invokes procedure
PLEpageload() passing three arguments:
the URI of the page to be called
the query string for URI called ("*null" if no query string)
the object ID of the HTML element where the loaded page will be located
Look at the following example used in this page:
when the button "monnalisa" is clicked,
the page "/howtoajax/html/monnalisa.htm" is loaded to position "location1":