SQL from the Trenches
Download
Report
Transcript SQL from the Trenches
RPG and Ajax
why you should care?
Presented by:
Robert Arce
RPG and Ajax by Robert Arce from
PrismaTech.
What is AJAX?
It’s a way to create Interactive Web
Applications
Asynchronous JavaScript and XML
It’s a small but very popular part of
JavaScript
RPG and Ajax by Robert Arce from
PrismaTech.
AJAX is a combination of:
XHTML
CSS (Cascading Style Sheets)
The DOM (Document Object Model)
accessed using JavaScript
XML, the format of the data being
transferred between server and client
XMLHttpRequest to retrieve data from
the server
RPG and Ajax by Robert Arce from
PrismaTech.
The benefits of AJAX:
Most of the processing for the application is
happening within the user’s browser, and
requests to the server for data are usually
short.
Rich applications that depend on Web-based
data, without the performance penalty of
older approaches, which required that the
server send back entire pages of HTLM in
response to user actions
RPG and Ajax by Robert Arce from
PrismaTech.
Components
XHTML – contains the content and structure of the
page
CSS – controls the appearance and presentation of
the page. Typography, colors, and size and
placement of elements and images
JavaScript – controls the behavior of the page
manipulating the representation of the objects
within the Document Object Model (DOM)
RPG and Ajax by Robert Arce from
PrismaTech.
How can we use it?
Control input from the user
Change page on the fly based on the
data coming from the iSeries
Retrieve data from the iSeries as user is
typing characters in a field
Verify the data format in a form before
submitting request to the server
RPG and Ajax by Robert Arce from
PrismaTech.
XMLHttpRequest
A JavaScript Class that lets you make
asynchronous HTTP requests from
JavaScript
Make an HTTP request from a
JavaScript event
A call back JavaScript function is
invoked at each state of the HTTP
request and response
RPG and Ajax by Robert Arce from
PrismaTech.
XMLHttpRequest Properties
onreadystatechange - call back function for
state changes
readyState - the current state of the HTTP
call
responseText - the text result of the request
responseXML - DOM xml object from the
request
status - HTTP status code of the response
statusText - HTTP status text
RPG and Ajax by Robert Arce from
PrismaTech.
HTML part
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Shakespeare's Plays</title>
<link type="text/css" rel="stylesheet"
ref="script01.css" />
<script type="text/javascript" src="script01.js">
</script>
</head>
<body>
<h1>MMSA presentation</h1>
<div id='ajaxDiv'>Result will display here</div>>
</body>
</html>
RPG and Ajax by Robert Arce from
PrismaTech.
Javascript – AJAX – part 1-3
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
RPG and Ajax by Robert Arce from
PrismaTech.
Javascript – AJAX – part 2-3
// Create function that will receive data sent from the
server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay= document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
//0=Unitialized; Object contains no data
//1=Loading; 2=Loaded; object is loading or loaded
//3=Interactive; user may interact with object but not
fully loaded
//4=Complete; object has finished initializing
RPG and Ajax by Robert Arce from
PrismaTech.
Javascript – AJAX – part 3-3
var itemnumber =
document.getElementById('itemnumber').value;
var queryString = "?itemnumber=" + itemnumber;
//This is the actual call to the server
//Open has three parms: HTTP request method “GET”, “POST”
or “HEAD”, URL to a file on the server and a boolean
telling the server if request is asynchronous o not.
ajaxRequest.open("GET", "getItemImageSrv.php"+
queryString, true);
ajaxRequest.send(null);
RPG and Ajax by Robert Arce from
PrismaTech.
Tools
Firefox with Firebug
Internet Explorer Developer Tools
WDSc – yes same IDE for RPG
Zend studio for eclipse i5
RPG and Ajax by Robert Arce from
PrismaTech.
References
JavaScript & Ajax – Peachpit Press –
Tom Negrino and Dori Smith
Professional Ajax – 2nd Edition –
WROX – Nicholas C. Zakas, jeremy
McPeak, Joe Fawcett
Web places…
http://www.javascriptworld.com/
RPG and Ajax by Robert Arce from
PrismaTech.
AJAX !!!
Use this technique for
Developing your Web
Applications to talk to your
RPG programs
Thank you !!!
RPG and Ajax by Robert Arce from
PrismaTech.