Ajax support is now implementet in iSeries2web.
It's use to send data to the server without having to send a full Form. This means that you can send data from a part of the screen and therefore avoid to generate a full screen again.
In this example we implement a textbox, when pressing "update" the text is transfered to the backend. And saved (here using the new DocLink function, but it could be to any other program)
In the code the First thing that is done is that the ajax javascript code executes a call to get the inner Html, to display it the first time.
After this the retrived html, is used to send the next request. The request it self works as a normal iSeries2web call.
The code in the initial HTML looks like this. (The remarked alert's is used to easy debugging of the script)
<html>
<head>
<script src="/prototype/prototype.js" type="text/javascript"></script>
<script type="text/javascript">
function fs_ajax_submit()
{
//alert('Go');
// do the same with a callback:
//alert($('note').fs_doctext.value);
$('note').fs_doctext.value=Base64.encode($('note').fs_doctext.value);
$('note').request({
onComplete: function(transport){
//alert(transport.responseText);
document.getElementById('textbox').innerHTML=transport.responseText;
$('note').fs_doctext.value = Base64.decode($('note').fs_doctext.value);
}
})
$('note').fs_doctext.value='Updating - please wait';
}</script>
</head>
<body>
<table id="fs_doclink" width="99%" cellpadding="0" cellspacing="0"><tr><td>
<div id="textbox">
</div>
<script type="text/javascript">
new Ajax.Request('i2w.aspx?[[fs_doclink]]',{method:'get', onSuccess: function(transport){
document.getElementById('textbox').innerHTML=transport.responseText;
$('note').fs_doctext.value = Base64.decode($('note').fs_doctext.value);
//|| "no response text";
//alert("Success! \n\n");
},
onFailure: function(){ alert('Something went wrong...') }
});
</script>
</td></tr></table>
</body>
</html>
First the code calls iSeries2web to get the extra html to put into the textbox div.
after this the returning html (note_edit.htm) takes care of the rest and uses the function in the header to communicate with iSeries2web.
The data that is return when the page is rendered look like this:
<?xml version="1.0" ?>
<xml id="fs_doctext">
<root>
<record>
<fs_doctext> <![CDATA[VGhpcyBJcyBhIFRleHQg]]> </fs_doctext>
<dockey> <![CDATA[ acus001_doc]]> </dockey>
<docid>5</docid>
</record>
</root>
</xml>
The Return streem holds the new html to be injected into the DIV and is alerady merged with the html.
The unmerged html look like this.
<body style="margin: 0; background-color: #ECECF4" >
<form name="note" action="i2w.aspx" method="post">
<table id="fs_doctext" width="99%" height="99%">
<tr><td style="height: 25"><input type="button" name="b_update" value="[[l_update]]" onclick="fs_ajax_submit()"></td></tr>
<tr>
<td>
<input type="hidden" name="dockey" value="[[dockey]]"><input type="hidden" name="docid" value="[[docid]]">
<div style="width:100%">
<textarea cols="100" rows="20" id="fs_doctext" name="fs_doctext">[[fs_doctext]]</textarea></div></td>
</tr>
</table>
</form>
</body>
Note! It uses the new base64 encoder to make shure that text entered into the testbox is can be transfered back and forth to the server, as no tags or special charatcers are allowed in the http stream.