git.infodrom.org Git - infodrom/rico3/blob - examples/html/gridJSbuffer2.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">\r
   2 <html>\r
   3 <head>\r
   4 <title>Rico LiveGrid-JavaScript Buffer</title>\r
   5 \r
   6 <script src="LoadRicoClient.js" type="text/javascript"></script>\r
   7 <link href="../demo.css" type="text/css" rel="stylesheet" />\r
   8 \r
   9 <script type='text/javascript'>\r
  10 Rico.loadModule('LiveGridAjax','LiveGridMenu');\r
  11 \r
  12 var grid, buffer;\r
  13 \r
  14 Rico.onLoad( function() {\r
  15   var opts = {  \r
  16     frozenColumns : 1,
  17     useUnformattedColWidth: false,\r
  18     menuEvent: 'click',\r
  19     columnSpecs  : [{width:200}]\r
  20   };\r
  21   buffer=new Rico.Buffer.AjaxSQL(jsfetch);\r
  22   grid=new Rico.LiveGrid ('jsgrid', buffer, opts);\r
  23   grid.menu=new Rico.GridMenu();\r
  24 });\r
  25 \r
  26 function jsfetch(options) {\r
  27   Rico.writeDebugMsg("jsfetch");\r
  28   var newRows=[], totrows=500;\r
  29   var offset=options.parameters.offset;\r
  30   var limit=Math.min(totrows-offset,options.parameters.page_size)\r
  31   for (var r=0; r<limit; r++) {\r
  32     var row=[];\r
  33     row.push(new Date().toString());\r
  34     row.push(offset.toString());\r
  35     for (var c=2; c<5; c++)\r
  36       row.push('cell '+(r+offset)+':'+c);\r
  37     newRows.push(row);\r
  38   }\r
  39   options.onComplete(newRows,false,totrows);
  40 }\r
  41 </script>\r
  42 \r
  43 <style type="text/css">\r
  44 div.ricoLG_cell { white-space: nowrap; }\r
  45 </style>\r
  46 </head>\r
  47 \r
  48 <body>\r
  49 <div id='explanation'>\r
  50 Base Library: \r
  51 <script type='text/javascript'>\r
  52 document.write(Rico.Lib+' '+Rico.LibVersion);\r
  53 </script>\r
  54 <hr>\r
  55 This example demonstrates how to substitute a javascript\r
  56 call for an AJAX request in the AjaxSQL buffer. Rather than\r
  57 passing a string containing the url to the data provider,\r
  58 you pass a function to the Rico.Buffer.AjaxSQL constructor.\r
  59 <pre>\r
  60 buffer=new Rico.Buffer.AjaxSQL(<strong>jsfetch</strong>);\r
  61 function <strong>jsfetch</strong>(options) {\r
  62   var newRows=[], totrows=500;\r
  63   var offset=options.parameters.offset;\r
  64   var limit=Math.min(totrows-offset,options.parameters.page_size)\r
  65   for (var r=0; r&lt;limit; r++) {\r
  66     var row=[];\r
  67     row.push(new Date().toString());\r
  68     row.push(offset.toString());\r
  69     for (var c=2; c&lt;5; c++) row.push('cell '+(r+offset)+':'+c);\r
  70     newRows.push(row);\r
  71   }\r
  72   options.onComplete(newRows,false,totrows);
  73 }\r
  74 </pre>\r
  75 </div>\r
  76 \r
  77 <p class="ricoBookmark"><span id="jsgrid_bookmark">&nbsp;</span></p>\r
  78 <table id="jsgrid" class="ricoLiveGrid" cellspacing="0" cellpadding="0">\r
  79   <tr>\r
  80           <th>Time of Data Fetch</th>\r
  81           <th>Offset</th>\r
  82           <th>Column 3</th>\r
  83           <th>Column 4</th>\r
  84           <th>Column 5</th>\r
  85   </tr>\r
  86 </table>\r
  87 \r
  88 <!--\r
  89 <textarea id='jsgrid_debugmsgs' rows='5' cols='100' style='font-size:x-small;'></textarea>\r
  90 -->\r
  91 </body>\r
  92 </html>\r