1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
\r
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
\r
5 <title>Rico LiveGrid</title>
\r
6 <link href="ricoDocs.css" rel="Stylesheet" type="text/css" />
\r
10 <h1>Rico LiveGrid の作成</h1>
\r
12 <p>Rico LiveGrid は 2 次元の JavaScript 配列でデータをバッファリングして、スクロールするテーブルにデータを表示します。
\r
13 ユーザがグリッドを垂直にスクロールする事によって、データは配列からグリッド上へ動的にコピーされます。
\r
14 バッファは次の項目からロードされる事が出来ます。
\r
16 <li><a href='#model1'>javascript 配列</a>
\r
17 <li><a href='#model2'>HTML テーブル</a>
\r
18 <li><a href='#model3'>XML ファイル</a>
\r
19 <li><a href='#model4'>SQL データベースクエリ</a>
\r
20 <li><a href='#model5'>カスタム javascript コールバック関数</a>
\r
24 <h2><a name='model1'>利用モデル 1: javascript 配列からのデータのロード</a></h2>
\r
26 <ul><li>javascript 配列へ表示されるデータをロードして下さい。
\r
29 [1,'Cell 1:2','Cell 1:3','Cell 1:4','Cell 1:5'],
\r
30 [2,'Cell 2:2','Cell 2:3','Cell 2:4','Cell 2:5'],
\r
31 [3,'Cell 3:2','Cell 3:3','Cell 3:4','Cell 3:5'],
\r
32 [4,'Cell 4:2','Cell 4:3','Cell 4:4','Cell 4:5']
\r
36 <li>グリッドを表示するのに必要な Rico javascript と css ファイルをロードして下さい。
\r
38 Rico.loadModule('LiveGrid','LiveGridMenu','greenHdg.css');
\r
42 <dd>これは、静的なバッファ（ AJAX では無い）で LiveGrid を表示するのに必要な Rico javascript と css ファイルをロードします。
\r
44 <dd>これは、デフォルトのグリッドメニューをロードします。
\r
45 このメニューは、LiveGrid で出来る事の全てにアクセスする方法を提供します。
\r
46 それは選択された列と使用されるバッファのタイプに基づく、ユーザに提示された選択項目を調整します。
\r
47 メニュー無しでグリッドを使用するか、またはアプリケーションの必要性によりカスタマイズされた独自のメニューを作成するかを、選ぶことが出来ます。
\r
49 <dd>Rico は、いくつかのサンプルグリッドスタイルを持っています。
\r
50 coffee-with-milk、grayedout、greenHdg、iegradient (Internet Explorer 専用)、tanChisel、そして warmfall。
\r
51 あなたは、含まれているスタイルの 1 つを選ぶか、独自の物を作成するかを選ぶでしょう。
\r
54 <li>テーブルのデータ列を Rico バッファオブジェクトにロードして下さい。
\r
56 var buffer=new Rico.Buffer.Base();
\r
57 buffer.loadRowsFromArray(myData);
\r
60 <li>グリッドの見出しを含む、グリッドのオプションを定義して下さい。
\r
63 useUnformattedColWidth: false,
\r
65 visibleRows : 'data',
\r
67 columnSpecs : [{Hdg:'Column 1',type:'number', ClassName:'alignright'},
\r
75 <li>グリッド、Rico.Buffer インスタンス、およびグリッドオプションのためにベース id を渡して、LiveGrid をインスタンス化してください。
\r
78 var ex1=new Rico.LiveGrid ('ex1', buffer, opts);
\r
81 <li>グリッドのためのデフォルトポップアップメニューを利用可能にするために、グリッドのメニューのプロパティを Rico.GridMenu のインスタンスに割り当てて下さい。
\r
84 ex1.menu=new Rico.GridMenu();
\r
87 <li>Rico.loadModule は、window.onload イベントの終了<em>後</em>に実行されると思います。
\r
88 あなたは Rico.onLoad メソッドに初期化関数を渡さなければなりません、なぜなら、Rico モジュールがロードされた後で、グリッドの初期化が実行される事を確実なものにするためです。
\r
89 javascript のすべてをまとめると、このようになります。
\r
91 <script type='text/javascript'>
\r
92 Rico.loadModule('LiveGrid','LiveGridMenu','greenHdg.css');
\r
94 Rico.onLoad( function() {
\r
96 [1,'Cell 1:2','Cell 1:3','Cell 1:4','Cell 1:5'],
\r
97 [2,'Cell 2:2','Cell 2:3','Cell 2:4','Cell 2:5'],
\r
98 [3,'Cell 3:2','Cell 3:3','Cell 3:4','Cell 3:5'],
\r
99 [4,'Cell 4:2','Cell 4:3','Cell 4:4','Cell 4:5']
\r
102 useUnformattedColWidth: false,
\r
104 visibleRows : 'data',
\r
106 columnSpecs : [{Hdg:'Column 1',type:'number', ClassName:'alignright'},
\r
112 var buffer=new Rico.Buffer.Base();
\r
113 buffer.loadRowsFromArray(myData);
\r
114 var ex1=new Rico.LiveGrid ('ex1', buffer, opts);
\r
115 ex1.menu=new Rico.GridMenu();
\r
120 <li>最後に、グリッドを実行すべき位置に、HTML マークアップ に div 要素を配置して下さい。
\r
121 ブックマークのためのマークアップを含む事により、グリッドのスクロール位置が表示されます。
\r
123 <p class="ricoBookmark"><span id="ex1_bookmark"> </span></p>
\r
124 <div id="ex1"></div>
\r
132 <h2><a name='model2'>利用モデル 2: HTML テーブルからのデータのロード</a></h2>
\r
134 <ul><li>見出しは <code><thead></code> セクションにより、データは <code><tbody></code> セクションにより、HTML テーブルを定義して下さい。
\r
135 ブックマークのためのマークアップを含む事により、グリッドのスクロール位置が表示されます。
\r
137 <p class="ricoBookmark"><span id="data_grid_bookmark"> </span></p>
\r
138 <table id="data_grid">
\r
142 <th>First column name</th>
\r
143 <th>Second column name</th>
\r
145 <th>Last column name</th>
\r
153 <td>Row 1, column 1 data</td>
\r
154 <td>Row 1, column 2 data</td>
\r
156 <td>Row 1, last column data</td>
\r
160 <td>Row 2, column 1 data</td>
\r
161 <td>Row 2, column 2 data</td>
\r
163 <td>Row 2, last column data</td>
\r
169 <td>Row n, column 1 data</td>
\r
170 <td>Row n, column 2 data</td>
\r
172 <td>Row n, last column data</td>
\r
179 <li>グリッドを表示するために必要な Rico javascript と css ファイルをロードして下さい。
\r
181 Rico.loadModule('LiveGrid','LiveGridMenu','greenHdg.css');
\r
185 <dd>これは、静的なバッファ（ AJAX では無い）で LiveGrid を表示するのに必要な Rico javascript と css ファイルをロードします。
\r
187 <dd>これは、デフォルトのグリッドメニューをロードします。
\r
188 このメニューは、LiveGrid で出来る事の全てにアクセスする方法を提供します。
\r
189 それは選択された列と使用されるバッファのタイプに基づく、ユーザに提示された選択項目を調整します。
\r
190 メニュー無しでグリッドを使用するか、またはアプリケーションの必要性によりカスタマイズされた独自のメニューを作成するかを、選ぶことが出来ます。
\r
192 <dd>Rico は、いくつかのサンプルグリッドスタイルを持っています。
\r
193 coffee-with-milk、grayedout、greenHdg、iegradient (Internet Explorer 専用)、tanChisel、そして warmfall。
\r
194 あなたは、含まれているスタイルの 1 つを選ぶか、独自の物を作成するかを選ぶでしょう。
\r
197 <li>テーブルのデータ列を Rico バッファオブジェクトにロードして下さい。
\r
199 var buffer = new Rico.Buffer.Base($('data_grid').tBodies[0]);
\r
202 <li>最後に、HTML テーブルの DOM の id とオプションを Rico.Buffer インスタンス に渡して
\r
203 （これは、 LiveGrid がテーブルの thead セクションから列の見出しをロードするのを許可します）、
\r
205 （この場合、最初の列の幅は 50 ピクセル、2 番目の列は 80 ピクセルの幅となります）。
\r
208 var grid_options = { columnSpecs: [ {width:50}, {width:80} ] };
\r
209 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
212 <li>Rico.loadModule は、window.onload イベントの終了<em>後</em>に実行されると思います。
\r
213 あなたは Rico.onLoad メソッドに初期化関数を渡さなければなりません、
\r
214 なぜなら、Rico モジュールがロードされた後で、グリッドの初期化が実行される事を確実なものにするためです。
\r
215 javascript のすべてをまとめると、このようになります。
\r
218 <script type='text/javascript'>
\r
219 Rico.loadModule('LiveGrid','LiveGridMenu','greenHdg.css');
\r
221 Rico.onLoad( function() {
\r
222 var buffer = new Rico.Buffer.Base($('data_grid').tBodies[0]);
\r
223 var grid_options = { columnSpecs: [width:50, width:80] };
\r
224 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
232 <h2><a name='model3'>利用モデル 3: XML ファイルからのデータのロード</a></h2>
\r
234 <ul><li>テーブルのヘッダセルを持ち、テーブルのボディセルは持たない、HTML テーブルを定義して下さい。
\r
235 ブックマークのためのマークアップを含む事により、グリッドのスクロール位置が表示されます。
\r
237 <p class="ricoBookmark"><span id="data_grid_bookmark"> </span></p>
\r
238 <table id="data_grid">
\r
241 <th>First column name</th>
\r
242 <th>Second column name</th>
\r
248 <li>グリッドを表示するために必要な Rico javascript と css ファイルをロードして下さい。
\r
250 Rico.loadModule('LiveGridAjax','LiveGridMenu','greenHdg.css');
\r
254 <dd>これは、AJAX 対応のバッファで LiveGrid を表示するのに必要な Rico javascript と css ファイルをロードします。
\r
256 <dd>これは、デフォルトのグリッドメニューをロードします。
\r
257 このメニューは、LiveGrid で出来る事の全てにアクセスする方法を提供します。
\r
258 それは選択された列と使用されるバッファのタイプに基づく、ユーザに提示された選択項目を調整します。
\r
259 メニュー無しでグリッドを使用するか、またはアプリケーションの必要性によりカスタマイズされた独自のメニューを作成するかを、選ぶことが出来ます。
\r
261 <dd>Rico は、いくつかのサンプルグリッドスタイルを持っています。
\r
262 coffee-with-milk、grayedout、greenHdg、iegradient (Internet Explorer 専用)、tanChisel、そして warmfall。
\r
263 あなたは、含まれているスタイルの 1 つを選ぶか、独自の物を作成するかを選ぶでしょう。
\r
266 <li>データをフェッチしてテーブルを実装するために、Rico バッファを作成して下さい。
\r
267 AjaxXML バッファは、グリッドのスタートアップで提供された URL に、一つだけのデータのリクエストを行います。
\r
269 var buffer = new Rico.Buffer.AjaxXML('/controller/action?format=xml');
\r
272 この URL（実例の中にある "/controller/action?format=xml"）は、次のフォーマットでデータを返さなければなりません。
\r
274 <ajax-response>
\r
275 <response type='object' id='data_grid_updater'>
\r
276 <rows update_ui='true' offset='0'>
\r
277 <tr><td>Data for row 1, cell 1</td><td>Data for row 1, cell 2</td></tr>
\r
278 <tr><td>Data for row 2, cell 1</td><td>Data for row 2, cell 2</td></tr>
\r
281 </ajax-response>
\r
284 <li>最後に、HTML テーブルの DOM の ID とオプションを Rico.Buffer インスタンス に渡して、LiveGrid を初期化します
\r
285 （columnSpecs は必要ではありませんが、列のカスタム化のためのプレースホルダーとして、ここに表示されます）。
\r
287 var grid_options = { columnSpecs: [,] };
\r
288 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
291 <li>Rico.loadModule は、window.onload イベントの終了<em>後</em>に実行されると思います。
\r
292 あなたは Rico.onLoad メソッドに初期化関数を渡さなければなりません、
\r
293 なぜなら、Rico モジュールがロードされた後で、グリッドの初期化が実行される事を確実なものにするためです。
\r
294 javascript のすべてをまとめると、このようになります。
\r
297 <script type='text/javascript'>
\r
298 Rico.loadModule('LiveGridAjax','LiveGridMenu','greenHdg.css');
\r
300 Rico.onLoad( function() {
\r
301 var buffer = new Rico.Buffer.AjaxXML('/controller/action?format=xml');
\r
302 var grid_options = { columnSpecs: [,] };
\r
303 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
310 <h2><a name='model4'>利用モデル 4: SQL データベースクエリからデータをロードする</a></h2>
\r
312 <p>下記の説明は、Rico LiveGrid プラグインにおける ASP と PHP の実装に直接当てはまります。
\r
313 概念は .net の同じですが、実装方法は全く異なります
\r
314 (これがどのように .net で実装されるかについては、"ex2simple.aspx" を調べて下さい)。
\r
317 <li>実行するためにクエリを含むセッション変数を定義して下さい。
\r
318 変数名は、下の表の ID に適合しなければなりません。
\r
319 データを要求するとき、グリッドは ricoXMLquery にそのIDを渡します、そして、ricoXMLquery はセッションからクエリテキストを取得するためにそれを利用するでしょう。
\r
324 session.contents("data_grid")="select ID,Name,City from customers"
\r
331 $_SESSION['data_grid']="select ID,Name,City from customers";
\r
337 Sub Page_Load(Sender As object, e As EventArgs)
\r
338 data_grid.sqlQuery="select ID,Name,City from customers"
\r
339 ' session variable is set by the control
\r
345 <li>テーブルのボディセルでは無く、ヘッダセルを供給して、HTML テーブルを定義して下さい。
\r
346 ブックマークのためのマークアップを含む事により、グリッドのスクロール位置が表示されます。
\r
348 <p class="ricoBookmark"><span id="data_grid_bookmark"> </span></p>
\r
349 <table id="data_grid">
\r
352 <th>Customer #</th>
\r
353 <th>Customer Name</th>
\r
354 <th>City</th>
\r
360 <li>グリッドを表示するために必要な Rico javascript と css ファイルをロードして下さい。
\r
362 Rico.loadModule('LiveGridAjax','LiveGridMenu','greenHdg.css');
\r
366 <dd>これは、AJAX 対応バッファで LiveGrid を表示するのに必要な Rico javascript と css ファイルをロードします。
\r
368 <dd>これは、デフォルトのグリッドメニューをロードします。
\r
369 このメニューは、LiveGrid で出来る事の全てにアクセスする方法を提供します。
\r
370 それは選択された列と使用されるバッファのタイプに基づく、ユーザに提示された選択項目を調整します。
\r
371 メニュー無しでグリッドを使用するか、またはアプリケーションの必要性によりカスタマイズされた独自のメニューを作成するかを、選ぶことが出来ます。
\r
373 <dd>Rico は、いくつかのサンプルグリッドスタイルを持っています。
\r
374 coffee-with-milk、grayedout、greenHdg、iegradient (Internet Explorer 専用)、tanChisel、そして warmfall。
\r
375 あなたは、含まれているスタイルの 1 つを選ぶか、独自の物を作成するかを選ぶでしょう。
\r
378 <li>データをフェッチしてテーブルを実装するために、Rico バッファを作成して下さい。
\r
379 一度にすべてのデータをグリッドにフェッチする AjaxXML バッファと異なり、 AjaxSQL バッファは、塊でデータをフェッチします。
\r
380 これは、LiveGrid が能率的に数千または何十万の列を含んでいるクエリ結果を表示する事を可能にします。
\r
383 var buffer = new Rico.Buffer.AjaxSQL('ricoXMLquery.asp');
\r
386 この URL （"ricoXMLquery.asp" の実例で）は、データベースからデータをフェッチして、
\r
387 この XML フォーマットでグリッドにそれを戻すために、含まれるプラグインの内の 1 つを利用します。
\r
390 <ajax-response>
\r
391 <response type='object' id='data_grid_updater'>
\r
392 <rows update_ui='true' offset='0'>
\r
393 <tr><td>Data for row 1, cell 1</td><td>Data for row 1, cell 2</td></tr>
\r
394 <tr><td>Data for row 2, cell 1</td><td>Data for row 2, cell 2</td></tr>
\r
396 <rowcount>99</rowcount>
\r
398 </ajax-response>
\r
401 <rowcount> タグはオプションですが、リクエストに "get_total" クエリーストリングパラメータが存在する場合は、
\r
404 <li>最後に、HTML テーブルの DOM の ID とオプションを Rico.Buffer インスタンス に渡して、LiveGrid を初期化します
\r
405 （columnSpecs は必要ではありませんが、列のカスタム化のためのプレースホルダーとして、ここに表示されます）。
\r
407 var grid_options = { columnSpecs: [,,] };
\r
408 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
411 <li>Rico.loadModule は、window.onload イベントの終了<em>後</em>に実行されると思います。
\r
412 あなたは Rico.onLoad メソッドに初期化関数を渡さなければなりません、
\r
413 なぜなら、Rico モジュールがロードされた後で、グリッドの初期化が実行される事を確実なものにするためです。
\r
414 javascript のすべてをまとめると、このようになります。
\r
416 <script type='text/javascript'>
\r
417 Rico.loadModule('LiveGridAjax','LiveGridMenu','greenHdg.css');
\r
419 Rico.onLoad( function() {
\r
420 var buffer = new Rico.Buffer.AjaxSQL('ricoXMLquery.asp');
\r
421 var grid_options = { columnSpecs: [,,] };
\r
422 var grid = new Rico.LiveGrid('data_grid', buffer, grid_options);
\r
429 <h2><a name='model5'>利用モデル 5: カスタムコールバック関数を利用してデータをロードする</a></h2>
\r
431 <p>このモデルは、 xmlHTTPrequest を利用してデータをフェッチするのでは無く、 javascript コールバック関数を
\r
432 利用してデータをフェッチする事以外はモデル 3 や 4 と同じ方法で動作します。
\r
433 これにより、コールバック関数で Google Gears を呼ぶような創造的な事をすることが出来ます。
\r
434 コールバックをセットアップする事は、非常に簡単です。
\r
435 データプロバイダの URL の文字列を含むデータを AjaxXML または AjaxSQL コンストラクタに渡すのでは無く、
\r
436 その代りにコールバック関数を渡すだけです。
\r
438 <p>以下の AjaxXML バッファを利用するコードは <a href='client/gridJSbuffer.html'>examples/client/gridJSbuffer.html</a> から取得出来ます。
\r
439 "jsfetch" コールバック関数は 100 行の長さで 5 列の幅の二次元配列を返します。
\r
440 AjaxXML は、そのバッファを（グリッドのスタートアップで）一度だけロードするので、 jsfetch は一度だけ呼ばれます。
\r
441 このオプションのハッシュは、Prototype の Ajax.Request メソッドで利用されるオプションのハッシュと構造が同じです。
\r
444 buffer=new Rico.Buffer.AjaxXML(<strong>jsfetch</strong>);
\r
446 function <strong>jsfetch</strong>(options) {
\r
447 Rico.writeDebugMsg("jsfetch");
\r
448 var newRows=[], offset=options.parameters.offset;
\r
449 for (var r=0; r<100; r++) {
\r
451 row.push(offset.toString());
\r
452 row.push(new Date().toString());
\r
453 for (var c=2; c<5; c++) row.push('cell '+r+':'+c);
\r
456 options.onComplete(newRows);
\r
460 <p>以下の AjaxSQL バッファを利用するコードは <a href='client/gridJSbuffer2.html'>examples/client/gridJSbuffer2.html</a> から取得出来ます。
\r
461 "jsfetch" コールバック関数は、500 行の長さで 5 列の幅の二次元配列をシミュレーションします。
\r
462 しかし、どんなコールバック中でも、その配列の <code>options.parameters.offset</code> 行から
\r
463 <code>options.parameters.offset + options.parameters.page_size</code> 行までのセクションが返されます。
\r
466 buffer=new Rico.Buffer.AjaxSQL(<strong>jsfetch</strong>);
\r
468 function <strong>jsfetch</strong>(options) {
\r
469 var newRows=[], totrows=500;
\r
470 var offset=options.parameters.offset;
\r
471 var limit=Math.min(totrows-offset,options.parameters.page_size)
\r
472 for (var r=0; r<limit; r++) {
\r
474 row.push(new Date().toString());
\r
475 row.push(offset.toString());
\r
476 for (var c=2; c<5; c++) row.push('cell '+(r+offset)+':'+c);
\r
479 options.onComplete(newRows,false,totrows);
\r
483 <p>options.onComplete は、次のパラメータをとります。
\r
485 <li>newRows - それぞれのアイテムが文字列の二次元配列
\r
486 <li>newAttr - それぞれのアイテムが、セルの acceptAttr の値、または acceptAttr が利用されていないなら false を含むオブジェクトの二次元配列
\r
487 <li>totalRows - データセット内の行の総数を表す整数
\r
488 <li>errMsg - エラーが起こったとき、ユーザに表示されるメッセージテキスト
\r
494 <h2><a name='debug'></a>デバッグ</h2>
\r
495 <p>Rico 2.0 はメッセージログにタイムスタンプデバッグメッセージを配達する能力を持っています。
\r
496 そのログは、HTML のテキストエリアか、ブラウザの javascript コンソールに表示されるでしょう。
\r
498 <li>もし、テキストエリアが '_debugmsgs' を加えたライブグリッドテーブルの ID と共に存在するならば、例えば
\r
499 <pre style='margin:3px;'><textarea cols="100" rows="5" id="data_grid_debugmsgs" /></pre>
\r
500 そして、このテキストエリアがメッセージログのために使われます。
\r
501 <li>あるいは、テキストエリアは Rico.setDebugArea() の呼び出しによって指定されるかもしれません。
\r
504 <textarea id='debug' rows='5' cols='80'></textarea>
\r
505 <script type='text/javascript'>
\r
506 Rico.setDebugArea('debug');
\r
510 <li>テキストエリアが指定されないならば、Rico はブラウザのビルトイン javascript コンソールを使おうとします。
\r
511 以下のコンソールで動作する事が知られています:
\r
513 <li>Firefox の <a href='http://www.getfirebug.com/' target='_blank'>Firebug</a> アドオンコンソール
\r
514 <li>Opera javascript コンソール
\r
515 <li>Safari javascript コンソール
\r
521 <p>Rico LiveGrid は、多くの機能的なビルトインが付属します
\r
522 その機能にアクセスするために、Rico はメニューのデフォルトの設定を含みます --
\r
523 ricoLiveGridMenu.js で定義されています。
\r
524 デフォルトメニューを使うために、単に 'LiveGridMenu' モジュールをロードして、
\r
525 そのグリッドメニュープロパティを Rico.GridMenu クラスのインスタンスに割り当てて下さい。
\r
527 Rico.loadModule('LiveGridMenu');
\r
529 var ex1=new Rico.LiveGrid ('ex1', buffer, grid_options);
\r
530 ex1.menu=new Rico.GridMenu();
\r
532 <p>デフォルトでは、ユーザがグリッドセルをダブルクリックする時メニューが開きます。
\r
533 メニューを開くイベントを変更するために、グリッドの <a href='#menuEvent'>menuEvent</a>
\r
535 以下のコードは、右クリックでメニューを開きます。
\r
537 Rico.loadModule('LiveGridMenu');
\r
539 var grid_options = {
\r
540 menuEvent: 'contextmenu'
\r
542 var ex1=new Rico.LiveGrid ('ex1', buffer, grid_options);
\r
543 ex1.menu=new Rico.GridMenu();
\r
545 <p>Rico.GridMenu は、更なるメニューアイテムを追加するために、コールバック（dataMenuHandler）を提供します。
\r
546 グリッドメニューは常に動的に構築されます -- ユーザーがクリックした行と列のためにカスタマイズされます。
\r
547 コールバック関数が毎回呼ばれるように、メニューは起動されて、
\r
548 それぞれの起動で要求されるメニューアイテムを加えなければなりません。
\r
550 Rico.loadModule('LiveGridMenu');
\r
552 var ex1=new Rico.LiveGrid ('ex1', buffer, grid_options);
\r
553 ex1.menu=new Rico.GridMenu();
\r
554 ex1.menu.options.dataMenuHandler=myCustomMenuItems;
\r
556 function myCustomMenuItems(grid,r,c,onBlankRow) {
\r
557 if (buffer.getWindowValue(r,c)=='Special Value')
\r
558 grid.menu.addMenuItem("Special menu item", specialAction);
\r
560 function specialAction() {
\r
565 <p>完全なカスタムメニューを作成する事も可能です。
\r
566 例えば、ex5.php/asp/aspx を見て下さい。
\r
571 <li>もし、ライブグリッドテーブル名に '_bookmark' が追加された名前に、DOM の ID が一致する要素を作成するなら、
\r
572 グリッドに表示されいるレコードの数を示しているテキストが更新されるでしょう。
\r
573 LiveGrid の実例は、一般的にこのマークアップを使います。
\r
575 <p class="ricoBookmark"><span id="data_grid_bookmark"> </span></p>
\r
577 <li>ライブグリッドを表示するブラウザは、<a href="http://www.quirksmode.org/css/quirksmode.html">strict （別名 "標準" ）モード</a> で実行されていなければなりません。
\r
578 したがって、あなたは <code> <html> </code> タグの直前に doctype の宣言を含めなければなりません。例えば
\r
581 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
\r
582 "http://www.w3.org/TR/html4/strict.dtd">
\r
590 var grid = new Rico.LiveGrid (table_id, rico_buffer, grid_options);
\r
595 <li><strong>table_id</strong> はライブグリッドによって実装される、テーブルの DOM id です
\r
596 <li><strong>rico_buffer</strong> は Rico のバッファです、例えば
\r
598 <li>Rico.Buffer.Base （AJAX 対応では無いテーブルのために）
\r
599 <li>Rico.Buffer.AjaxXML
\r
600 <li>Rico.Buffer.AjaxSQL
\r
602 <li><strong>grid_options</strong> （下記参照）
\r
605 <h3><a name="options"></a>オプション</h3>
\r
609 <dt>visibleRows （.net の行）
\r
611 正の整数は、グリッドが正確に多くの行を常に含まなければならないことを示しています。
\r
614 <li>-1: クライアントウィンドウに合わせたグリッドサイズ（デフォルト）
\r
615 <li>-2: クライアントウィンドウとデータの小さい方のグリッドサイズ
\r
616 <li>-3: ページのボディにスクロールバーを持たないためのグリッドサイズ
\r
617 <li>-4: DOM の親ノードによるグリッドサイズ
\r
621 <dd>表示される行数の最小値。visibleRows が 0 以下の時のみ利用される。（Rico 2b3 からはデフォルトが 2 で、Rico 2b3 までは 1）
\r
624 <dd>表示される行数の最大値。visibleRows が 0 以下の時のみ利用される。（デフォルトは 50）
\r
627 <dd>列の初期幅を設定する際に使われる整数。
\r
628 説明については <a href='#width'>列幅オプション</a> を見て下さい。
\r
631 <dt>useUnformattedColWidth
\r
632 <dd>列の初期幅を設定する際に使われる真偽値。
\r
633 説明については <a href='#width'>列幅オプション</a> を見て下さい。
\r
637 <dd>いくらかの計算のために、LiveGrid はページ上のスクロールバーの幅を知っている必要があります。（デフォルトは 19）
\r
640 <dd>固定された列の幅がウィンドウ幅を上回る時の、スクロールエリアのピクセル幅の最小値。（デフォルトは 100）
\r
646 <dt>offset<dd>表示されるデータの最初の行（デフォルトは 0）
\r
647 <dt>prefetchBuffer<dd>ページのロード時にバッファの（そして、その結果グリッドの）ロードを行いますか？
\r
648 <dt>sortCol<dd>初期ソートのための、列の名前かインデックス
\r
649 <dt>sortDir<dd>初期ソートの方向
\r
650 <br>取り得る値は 'ASC'、'DESC'
\r
651 <dt>getQueryParms<dd>もし true なら、フィルタパラメータのための、そのウェブページのクエリ文字列をチェックし、そして見つかるどんなフィルタでも適用します。
\r
652 フィルタパラメータは "f[x]=" の形でなければならず、"x" は列のインデックスです。（デフォルトは false ）
\r
658 <dd>グリッドの左側の固定された列の数（Excel のように）
\r
661 <dd>ソートを容易にするために、どのように見出しが表示されるかを定義する文字列。
\r
663 <li>'link' -- 見出しに列をソートしてくれるリンクを作成します（デフォルト）
\r
664 <li>'hover' -- ユーザは、ソートするために、見出しのセルのどんな部分でもクリックする事が出来ます。カーソルがセル上でホバーする時、見出しは背景色を変えます。
\r
665 <li>'none' -- 見出し上のイベントは利用不能です。
\r
668 <dt>hdrIconsFirst<dd>見出しの前後に、ソートとフィルタのアイコンを置きます（デフォルトは true）
\r
670 <dt><a name='allowColResize'>allowColResize</a><dd>ユーザによる列のリサイズを許しますか？
\r
671 true なら、個々の列のリサイズを利用不能にするために columnSpecs の <a href='#noResize'>noResize</a> を利用します。
\r
673 <dt>panels<dd>第二の見出しとして用いる事が出来る文字列の配列です。
\r
674 LiveGrid Forms で、入力フォーム上のタブを付けられたパネルのための見出しを提供します。
\r
676 <dt>PanelNamesOnTabHdr<dd>panels[] の文字列を第二の見出しとして利用するために 'true' を設定します。
\r
677 LiveGrid Forms では、 panels[] は入力フォームとしてのみ利用されるので、'false' が設定されるでしょう。
\r
679 <dt><a name='FilterLocation'></a>FilterLocation
\r
680 <dd>フィルタを設置する見出しの行を指定します。
\r
681 -1 は、新しい行をヘッダに追加し、新しい行がフィルタリングのために利用されるようにします。
\r
682 <a href='#filterUI'>filterUI</a> のオプションも見て下さい。
\r
685 <dd>選択フィルタで "show all values" を示すトークン（デフォルトは "___ALL___"）。
\r
690 <dt>resizeBackground
\r
691 <dd>列のリサイズハンドルに利用される画像（デフォルトは 'resize.gif'）
\r
694 <dd>列を昇順でソートする事を示すために使われる画像（デフォルトは 'sort_asc.gif'）
\r
697 <dd>列を降順でソートする事を示すために使われる画像（デフォルトは 'sort_desc.gif'）
\r
700 <dd>列に対し現在利用中のフィルタを示すために使われる画像（デフォルトは 'filtercol.gif'）
\r
708 <dd>グリッドのクッキーに、どの詳細設定を保存するかを指定します。
\r
709 一つのクッキーだけが、それぞれのグリッドのために利用されます。
\r
710 幅の設定が、列の非表示／表示の状態を含む事に注意して下さい。
\r
711 （デフォルトは {width:true, filter:false, sort:false}）
\r
712 <br>.netプラグインでは、このオプションは、3 つの別々のプロパティによって表現されます。
\r
713 saveColumnWidth、saveColumnFilter、saveColumnSort。
\r
716 <dd>クッキー名の先頭に付け加えられる文字列（デフォルトは 'RicoGrid.'）
\r
719 <dd>数字の日数前のクッキーは期限切れになります。
\r
720 指定しなければ、クッキーは現在のセッションの間だけ維持されます。（デフォルトは null）
\r
723 <dd>グリッドのクッキーを読む事が出来るトップレベルディレクトリを設定します。
\r
724 指定しなければ、それはクッキーを設定するページのパスになります。（デフォルトは null）
\r
727 <dd>クッキーがどのドメインに送られなければならないかについて、ブラウザに知らせます。
\r
728 指定しなければ、それはクッキーを設定するページのドメインになります。（デフォルトは null）
\r
732 <h4>ハイライティングとセレクション</h4>
\r
736 <dd>何がハイライトまたは選択されるかについて指定する文字列。
\r
738 <li>'cursorRow' -- the grid row under the cursor
\r
739 <li>'cursorCell' -- the grid cell under the cursor
\r
740 <li>'menuRow' -- the grid row where the menu is displayed
\r
741 <li>'menuCell' -- the grid cell where the menu is displayed
\r
742 <li>'selection' -- allow the user to select cells
\r
743 <li>'none' -- never highlight
\r
746 <dt>highlightSection
\r
747 <dd>テーブルのどのセレクションがハイライトされるかについて指定する整数
\r
751 <li>3 -- すべて（デフォルト）
\r
754 <dt>highlightMethod
\r
755 <dd>セルや行がハイライトされる方法。取り得る値は
\r
757 <li>'outline' -- クライアント側で、最も CPU 集約型では無い
\r
758 <li>'class' -- ハイライトされた セル／行 のCSS クラスを追加（デフォルト）
\r
759 <li>'both' -- アウトラインとクラスの両方を利用するハイライト
\r
762 <dd>クラスによってハイライトされる時、クラス名として利用されます（デフォルトは 'ricoLG_selection'）
\r
768 <dd>ユーザに 印刷／エクスポート を許す最大行数。
\r
769 印刷／エクスポート を利用不能にするには 0 を設定します。（デフォルトは 1000）
\r
772 <dd>エクスポートウィンドウが生成される時に、
\r
773 <a href='http://www.w3schools.com/htmldom/met_win_open.asp'>window.open()</a> に渡されるオプション文字列。
\r
774 （デフォルトは "height=400,width=500,scrollbars=1,menubar=1,resizable=1"）
\r
777 <h4>イベントコントロール</h4>
\r
779 <dt><a name='menuEvent'></a>menuEvent
\r
780 <dd>グリッドメニューがいつ呼び出されるべきかを指定する文字列
\r
782 <li>'click' -- シングルクリックでメニューを呼び出す
\r
783 <li>'dblclick' -- ダブルクリックでメニューを呼び出す（デフォルト）
\r
784 <li>'contextmenu' -- 右クリックでメニューを呼び出す
\r
785 <li>'none' -- メニューをポップアップしない
\r
789 <dd>window.resize イベントの間にグリッドの大きさを変更するかどうかを指定する真偽値？
\r
790 グリッドがアコーディオンに組み込まれる時に、これに false が設定されなくてはなりません。（デフォルトは true）
\r
795 <p>コンストラクタにオプションでイベントハンドラを渡す事は出来ませんが、LiveGrid が生成された後なら、設定されるかも知れません。</p>
\r
796 <dt>sortHandler<dd> （デフォルトは Rico.LiveGridMethods.sortHandler -- バインドされた）
\r
797 <dt>filterHandler<dd> （デフォルトは Rico.LiveGridMethods.filterHandler -- バインドされた）
\r
798 <dt>onRefreshComplete<dd> （デフォルトは Rico.LiveGridMethods.bookmarkHandler -- バインドされた）
\r
799 <dt>rowOverHandler<dd> （デフォルトは Rico.LiveGridMethods.rowMouseOver -- イベントリスナーとしてバインドされた）
\r
800 <dt>mouseDownHandler<dd> （デフォルトは Rico.LiveGridMethods.selectMouseDown -- イベントリスナーとしてバインドされた）
\r
801 <dt>mouseOverHandler<dd>（デフォルトは Rico.LiveGridMethods.selectMouseOver -- イベントリスナーとしてバインドされた）
\r
802 <dt>mouseUpHandler<dd> （デフォルトは Rico.LiveGridMethods.selectMouseUp -- イベントリスナーとしてバインドされた）
\r
803 <dt>onscroll<dd> グリッドが垂直にスクロールされる時は、いつでも呼ばれます。（デフォルトは null）
\r
804 <dt>onscrollidle<dd> グリッドが垂直にスクロールされた 1、2 秒後に呼ばれます。（デフォルトは null）
\r
805 <dt>click<dd> グリッドセルがクリックされた時に呼ばれます。（デフォルトは menuEvent='click' で無ければ null）
\r
806 <dt>dblclick<dd> グリッドセルがダブルクリックされた時に呼ばれます。（デフォルトは menuEvent='dblclick' で無ければ null）
\r
807 <dt>contextmenu<dd> グリッドセルが右クリックされた時に呼ばれます。（デフォルトは menuEvent='contextmenu' で無ければ null）
\r
810 <h4><a name="column"></a>列ごとの構成</h4>
\r
812 <p>各々の列のためのオプションは、columnSpecs オプションに含まれます。
\r
813 columnSpecs は、各々の列のためのエントリに関する配列です。
\r
814 各々の列のエントリは、以下のいずれかで行う事が出来ます。
\r
817 <li>null （デフォルト） -- その場合、Rico.TableColumn.DEFAULT. の仕様によって列はフォーマットされます。
\r
818 グリッドの多くの列が共通のフォーマットを共有するならば、グリッドのデフォルト列仕様をオーバーライドする事は意味があるかもしれません。
\r
820 Rico.TableColumn.DEFAULT = {ClassName:'aligncenter', width:50};
\r
822 この場合は、仕様の無いどんな列でも、整列は中央で幅は 50 ピクセルの内容を持ちます。
\r
824 <li>a string -- 列のフォーマットを指定する単純な方法を提供します。
\r
825 DOLLAR、EURO、PERCENT、QTY、DEFAULT の値がビルトインされています。
\r
827 温度フォーマットを定義したこの例は、weather.php から取得されます
\r
830 Rico.TableColumn.TEMP = {type:'number', decPlaces:0,
\r
831 ClassName:'alignright', suffix:'&deg;C', width:50};
\r
834 columnSpecs : [{width:120},{width:70},{width:70},{width:100},
\r
835 'TEMP','TEMP','TEMP',
\r
836 {width:150},{width:200},{width:60}]
\r
840 <li>an object -- 下記の表にあるプロパティの一つ以上のエントリを含む。
\r
841 ここに、列 0、1 と 3 が仕様を含む例を挙げます。
\r
842 列 2 はデフォルトの仕様を取得します。
\r
844 columnSpecs : [{canSort:false, noResize:true, ClassName:'alignright'},
\r
845 {ClassName:'aligncenter'},
\r
852 <dd>列の見出しテキストを指定する代わりの方法。
\r
853 グリッド ID が、html テーブルの代わりに <div> を参照するなら、LiveGrid によってのみ利用されます。
\r
856 <dd>列をソートする事が出来ます。（デフォルトは grid.options.canSortDefault）
\r
859 <dd>列をフィルタする事が出来ます。（デフォルトは grid.options.canFilterDefault）
\r
862 <dd>列のセルは、ドラッグアンドドロップオペレーションのソースとして用いられる事が出来ます。
\r
863 "DragAndDrop" モジュールはロードされなければなりません。
\r
864 一時的なドラッグオブジェクトは "LiveGridDraggable" クラスが持ちます。
\r
865 実例として、<a href='client/drag_and_drop_grid.html'>drag_and_drop_grid.html</a> を見て下さい。（デフォルトは false）
\r
868 <dd>列を 表示／非表示 する事が出来ます。（デフォルトは grid.options.canHideDefault）
\r
871 <dd>列は、初めは隠されていません。
\r
872 grid.options.saveColumnInfo.width が true で、列のためのクッキーに値があるなら、クッキーの値が優先されます。
\r
875 <dt><a name='width'></a>width
\r
876 <dd>列の初期幅（ピクセルで）を指定する整数。
\r
877 ここに、それぞれの列の初期幅を設定するために LiveGrid が利用するアルゴリズムがあります。
\r
879 <li>options.saveColumnInfo.width が true で、列情報がグリッドのクッキーに存在する場合は
\r
880 （以前にグリッドの列の上でリサイズを実行したユーザのために）
\r
884 <li>options.columnSpecs に列の幅仕様があれば、その幅仕様が利用されます。一例として、 ex3.php/asp/aspx を見て下さい。そうでない場合は、、、
\r
886 <li>options.useUnformattedColWidth が true で（デフォルト）、グリッドヘッダが html テーブルから初期化されるならば、htmlテーブルの列の幅が利用されます。
\r
887 通常 col タグを用いて初期テーブルの列幅をコントロールする事が出来ます。(例えば <col style='width:40px;' >)。
\r
889 テーブル幅全体がブラウザー幅より小さいならば、これは動作します。
\r
890 しかし、それがより大きいならば、ブラウザはしばしば "col width" を無視して、全ての列を利用できるウインドウ幅の中に押し込もうとします。
\r
891 このように、列幅を設定するためにこの方法を使用することは信頼出来ません。
\r
894 <li>options.useUnformattedColWidth が false ならば、列の幅は options.defaultWidth により設定されます。（デフォルトは 100）
\r
896 したがって、列幅を LiveGrid と SimpleGrid で設定する最も信頼できる方法は、options.columnSpecs[] ですべての列に幅を指定することになります。
\r
897 多くの列が共通の幅を共有するならば、options.useUnformattedColWidth=false を設定して、options.defaultWidth を共通の幅に設定する事によって、
\r
900 <dt><a name='noResize'>noResize</a>
\r
901 <dd>列のリサイズを許しますか？（デフォルトは <a href='#allowColResize'>grid.options.allowColResize</a>）
\r
904 <dd>デフォルトでは、LiveGrid はユニークな CSS クラス名を、table_id + '_col' + column_index の命名規約に従い、それぞれの列に割り当てます。
\r
905 例えば、グリッド 'mygrid' の第 4 列は、クラス名 'mygrid_col3' を持ちます。
\r
906 ClassName オプションの値は、このデフォルト名をオーバーライドします。
\r
907 ClassName オプションは、Rico が提供する 'alignright' と 'aligncenter' クラスによって列の整列を指定するために、最も一般的に用いられます。
\r
908 なので、グリッドの最初の 3 つの列が赤い背景色に白いテキストで表示されることを望むならば、あなたは以下のどちらでもすることが出来ます。
\r
912 .mygrid_col0 div.ricoLG_cell,
\r
913 .mygrid_col1 div.ricoLG_cell,
\r
914 .mygrid_col2 div.ricoLG_cell {
\r
916 background-color: red;
\r
924 .WhiteOnRed div.ricoLG_cell {
\r
926 background-color: red;
\r
930 columnSpecs : [{ClassName:'WhiteOnRed'},
\r
931 {ClassName:'WhiteOnRed'},
\r
932 {ClassName:'WhiteOnRed'},
\r
936 最後に、この ClassName がグリッドの見出しに適用されない点に注意してください -
\r
937 ヘッダの整列を達成するためには、<th> タグで align="right" を利用して下さい。
\r
940 <dd>これらの値の内の一つを含む文字列。
\r
942 <li>text - 列の値のどんなタグでも、ユーザに表示される前に取り除かれます。
\r
943 <li>showTags - 列の値のどんなタグでも、ユーザにテキストとして表示されます。
\r
944 <li>number - 列の値は数として扱われ、列仕様で与えられるどんな <a href='#NumberFormatting'>number formatting options</a> でも適用されます。
\r
945 <li>datetime - 列の値は 日付 & 時間 として扱われ、列仕様で与えられるどんな <a href='#DateFormatting'>date formatting options</a> でも適用されます。
\r
946 <li>UTCasLocalTime - 列やデータベースの値は GMT/UTC 日付 & 時間 として扱われ、列仕様で与えられるどんな <a href='#DateFormatting'>date formatting options</a> でも適用されます。
\r
947 表示される前に、その値はユーザのローカルタイムゾーンに変換されます。
\r
948 <li>date - 列の値は日付として扱われ、列仕様で与えられるどんな <a href='#DateFormatting'>date formatting options</a> でも適用されます。
\r
949 <li>raw (default) - 列の値は、グリッドのセルに直接表示されます。どんなHTMLマークアップでもセルにコピーされます。
\r
953 <dt><a name='control'></a>コントロール
\r
954 <dd>特別なフォーマットを列に提供するのに用いられるオブジェクト。
\r
955 いくつかの列コントロールは LiveGrid により提供されます。
\r
956 それらのためのコードは、 ricoLiveGridControls.js にあります。
\r
957 ここに、提供されるコントロールの簡潔な記述があります。
\r
959 <dl style='font-size:smaller;'>
\r
960 <dt>Rico.TableColumn.checkboxKey(showKey)
\r
961 <dd> <checkbox> <key value> として列のユニークキーを表示し、どのキーがユーザによって選択されているかを見逃しません。
\r
962 キーの値は <、 >、 または & を含むべきではありません。
\r
964 <dt>Rico.TableColumn.checkbox(checkedValue, uncheckedValue, defaultValue, readOnly)
\r
965 <dd>チェックボックスとして列を表示します。データベースの列は、二つの値のみを含まなければなりません（例えば yes/no）。
\r
966 以下のコードは、ex7 から取得されます（列の値は 1 と 0）。
\r
968 columnSpecs: [{canHide:false,
\r
969 control:new Rico.TableColumn.checkbox('1','0'),
\r
970 ClassName:'aligncenter'},
\r
974 <dt>Rico.TableColumn.textbox(boxSize, boxMaxLen, readOnly)
\r
975 <dd>テキストボックス内に列の値を表示します。
\r
977 <dt>Rico.TableColumn.HighlightCell(chkcol,chkval,highlightColor,highlightBackground)
\r
978 <dd>特定の値が指定された列に存在する時、グリッドのセルをハイライトします。
\r
979 以下のコードは ex2highlight から取得され、列 1 が "HANAR" を含む時、行全体をハイライトします。
\r
981 var CustId='HANAR';
\r
983 var highlight=Rico.TableColumn.HighlightCell;
\r
986 { control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
987 { control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
988 { control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
989 { control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
990 { control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
991 { type:'date', control:new highlight(CustIdCol,CustId,'red','yellow') },
\r
992 { type:'date', control:new highlight(CustIdCol,CustId,'red','yellow') }]
\r
995 <dt>Rico.TableColumn.bgColor()
\r
996 <dd>データベースの値が css カラーの名前や値を含みます。
\r
998 <dt>Rico.TableColumn.link(href,target)
\r
999 <dd>データベースの値が、他のページへの URL を含みます。
\r
1000 href パラメータは、文字列に "{x}" を含む事により、グリッドの値への参照を含むかもしれません。 x は列の番号です。
\r
1001 以下のコードは ex6 から取得されます。
\r
1004 {control:new Rico.TableColumn.link('ex2.asp?id={0}','_blank'),
\r
1009 <dt>Rico.TableColumn.image()
\r
1010 <dd>データベースの値が画像への url を含みます。
\r
1011 以下のコードは photos.php から取得されます。
\r
1013 imgctl=new Rico.TableColumn.image();
\r
1016 {control:imgctl,width:90},,,
\r
1017 {type:'datetime'},{width:200}]
\r
1020 <dt>Rico.TableColumn.lookup(map, defaultCode, defaultDesc)
\r
1021 <dd>データベースの値を表示される値にマップします。
\r
1024 <br>アプリケーション特有のロジックを実装する、独自の列コントロールを書く事も可能です。
\r
1027 // Display values white on black if
\r
1028 // first column contains the value "reverse"
\r
1029 // Usage: { control:new MyCustomColumn() }
\r
1030 MyCustomColumn = Class.create();
\r
1032 MyCustomColumn.prototype = {
\r
1033 initialize: function() {},
\r
1035 _clear: function(gridCell,windowRow) {
\r
1036 gridCell.style.color='';
\r
1037 gridCell.style.backgroundColor='';
\r
1038 gridCell.innerHTML='&nbsp;';
\r
1041 _display: function(v,gridCell,windowRow) {
\r
1042 var col0=this.liveGrid.buffer.getWindowValue(windowRow,0);
\r
1043 if (col0=="reverse") {
\r
1044 gridCell.style.color='white';
\r
1045 gridCell.style.backgroundColor='black';
\r
1047 gridCell.style.color='';
\r
1048 gridCell.style.backgroundColor='';
\r
1050 gridCell.innerHTML=this._format(v);
\r
1055 <dt><a name='filterUI'></a>filterUI
\r
1056 <dd><a href='#FilterLocation'>FilterLocation</a> オプションがグリッドに指定されるならば、filterUI はそれぞれの列がどのようにフィルタされるかについてコントロールします。
\r
1059 <li>null または省略されたら、列にはフィルタが表示されません。
\r
1060 <li>'t' - テキストボックスフィルタを生成し、レコードはユーザのキーボードからの入力によってフィルタされて表示されます。
\r
1061 <br>任意に後につくキャレット（^）は、テキストボックスの値が列の値の始めに一致すべき事を示します。
\r
1062 そうでない場合は、列の値のどこにでも一致します。
\r
1063 <br>任意に後につく数値はテキストボックスの数値を意味します（デフォルトのサイズは 10）
\r
1066 // will create a text box that is 20 characters wide
\r
1067 // text typed into the box will be compared to
\r
1068 // the beginning of each column value
\r
1070 <li>'s' - リストに含む事の出来るすべての列の値と共にセレクトリストフィルタを生成します。
\r
1071 グリッドのソースが SQL クエリなら、'select distinct' クエリを利用して実装されます。
\r
1076 <a name='NumberFormatting'></a>
\r
1077 <p><em>数値フォーマット：</em></p>
\r
1080 <dd>表示される前に、その値はこの数値によって乗算されます。（デフォルトは 1）
\r
1083 <dd>小数点より右側の桁数（デフォルトは 0）
\r
1086 <dd>小数点のシンボル（翻訳ファイルでオーバーライドされなければ、デフォルトは '.'）
\r
1089 <dd>千桁区切りのためのシンボル。（翻訳ファイルでオーバーライドされなければ、デフォルトは ','）
\r
1092 <dd>負数がどのように表示されるべきかを指定します。取り得る値は
\r
1094 <li>L= 先頭にマイナスをつける（デフォルト）
\r
1095 <li>T= 後ろにマイナスをつける
\r
1100 <dd>数に始まりの文字列を付加します。一般的に通貨シンボルです。
\r
1103 <dd>数値の終わりに付加される文字列。例えば、 "%" シンボル。</dd>
\r
1107 <a name='DateFormatting'></a>
\r
1108 <p><em>日付フォーマット:</em></p>
\r
1111 <dd>date または datetime をどのように表示するのかを指定する文字列。
\r
1112 デフォルトは "translateDate" であり、RicoTranslate オブジェクトで利用される dateFmt と timeFmt 文字列を意味します。
\r
1113 （各種言語の翻訳ファイルでオーバーライドされなければ、、date のデフォルトは "mm/dd/yyyy" であり、datetime は "mm/dd/yyyy hh:mm:ss a/pm" です。）
\r
1114 dateFmt="localeDate" ならば、その値は javascript のビルトイン関数である toLocaleDateString() を利用してフォーマットされる。
\r
1115 dateFmt="localeDateTime" ならば、その値は javascript のビルトイン関数である toLocaleString() を利用してフォーマットされる。
\r
1116 dateFmt 文字列は、以下の特殊文字シーケンスを含むでしょう。
\r
1122 <li>mmm - 3 文字の月名省略形。アジアの言語では、これはしばしば意味をなしません - これらの場合、それは完全な月の名前（mmmm と同じ）を返します。
\r
1123 <li>mm - 2 桁の月数（ゼロで埋められた）
\r
1124 <li>m - 1 または 2 桁の月数
\r
1126 <li>ddd - 3 文字の曜日省略形
\r
1127 <li>dd - 2 桁の日数（ゼロで埋められた）
\r
1128 <li>d - 1 または 2 桁の日数
\r
1129 <li>hh - 2 桁の時、 12 時間時計（ゼロで埋められた）
\r
1130 <li>h - 1 または 2 桁の時、 12 時間時計
\r
1131 <li>HH - 2 桁の分、 24 時間時計（ゼロで埋められた）
\r
1132 <li>H - 1 または 2 桁の時間、 24 時間時計
\r
1133 <li>nn - 2 桁の分（ゼロで埋められた）
\r
1134 <li>ss - 2 桁の秒（ゼロで埋められた）
\r
1135 <li>a/p - a または p （am または pm のための）
\r
1139 // display first column as "month year"
\r
1140 columnSpecs : [{type:date, dateFmt:'mmm yyyy'}]
\r
1145 <dd>日付の先頭に付け加えられる文字列
\r
1148 <dd>日付の終わりに付加される文字列。例えば、タイムゾーンを含めるために利用出来ます。
\r
1150 // indicate that times are GMT/UTC
\r
1151 columnSpecs : [{type:datetime, suffix:' UTC'}]
\r
projects / infodrom / rico3 / blob