<!--
Apache License, Version 2.0
Revised from Rico 2.0 demo code.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Rico LiveGrid-JavaScript Buffer</title>
<script src="rico21/src/rico.js" type="text/javascript"></script>
<link href="rico21/examples/client/css/demo.css" type="text/css" rel="stylesheet" />
<script type='text/javascript'>
Rico.loadModule('LiveGridAjax','LiveGridMenu','greenHdg.css');
var grid, buffer;
Rico.onLoad( function() {
var opts = {
frozenColumns : 1,
useUnformattedColWidth: false,
columnSpecs : [{width:200}]
};
buffer=new Rico.Buffer.AjaxSQL(jsfetch);
grid=new Rico.LiveGrid ('jsgrid', buffer, opts);
grid.menu=new Rico.GridMenu();
});
function jsfetch(options) {
Rico.writeDebugMsg("jsfetch");
var newRows=[], totrows=500;
var offset=options.parameters.offset;
var limit=Math.min(totrows-offset,options.parameters.page_size)
for (var r=0; r<limit; r++) {
var row=[];
row.push(new Date().toString());
row.push(offset.toString());
for (var c=2; c<5; c++)
row.push('cell '+(r+offset)+':'+c);
newRows.push(row);
}
options.onComplete(newRows,false,totrows);
}
</script>
<style type="text/css">
div.ricoLG_cell { white-space: nowrap; }
</style>
</head>
<body>
<div id='explanation'>
This example demonstrates how to substitute a javascript
call for an AJAX request in the AjaxSQL buffer. Rather than
passing a string containing the url to the data provider,
you pass a function to the Rico.Buffer.AjaxSQL constructor.
<pre>
buffer=new Rico.Buffer.AjaxSQL(<strong>jsfetch</strong>);
function <strong>jsfetch</strong>(options) {
var newRows=[], totrows=500;
var offset=options.parameters.offset;
var limit=Math.min(totrows-offset,options.parameters.page_size)
for (var r=0; r<limit; r++) {
var row=[];
row.push(new Date().toString());
row.push(offset.toString());
for (var c=2; c<5; c++) row.push('cell '+(r+offset)+':'+c);
newRows.push(row);
}
options.onComplete(newRows,false,totrows);
}
</pre>
</div>
<p class="ricoBookmark"><span id="jsgrid_bookmark"> </span></p>
<table id="jsgrid" class="ricoLiveGrid" cellspacing="0" cellpadding="0">
<tr>
<th>Time of Data Fetch</th>
<th>Offset</th>
<th>Column 3</th>
<th>Column 4</th>
<th>Column 5</th>
</tr>
</table>
<!--
<textarea id='jsgrid_debugmsgs' rows='5' cols='100' style='font-size:x-small;'></textarea>
-->
</body>
</html>
|