Substitute a javascript call for an AJAX request in the AjaxSQL buffer

 
<!--
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&lt;limit; r++) {
    var row=[];
    row.push(new Date().toString());
    row.push(offset.toString());
    for (var c=2; c&lt;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">&nbsp;</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>
Substitute a javascript call for an AJAX request in the AjaxSQL buffer : Ajax « Rico « JavaScript DHTML

Related examples in the same category
