本日は少々毛色の違う話題を。
私は、お仕事でプログラムを書いている。いわゆるLAPP(Linux Apache PostgreSQL PHP)という奴である。
ブラウザ側では、jQueryやjqGridを使って非同期通信をやっている。いわゆるAJASON（Asynchronous JavaScript + JSON）という奴である。
なんで、Ajax（XMLを使う）でなくAJASON（JSONを使う）かというと
変換が楽だから！といういたって不精な理由である。（;´▽｀A``
当然、XMLを使わないことで出来ないこともあるわけだが、変換が楽という対価には代えがたい。
jqGridの詳細については
こことか
ここを参照して頂きたい。
簡単に言うと表を作ってくれる便利なツールである。しかし案外ネットの情報が少ないと思う。（何度となくネットの情報の渦にのまれたことか・・・。）
かつ、おっさんなのでなんでもすぐに忘れてしまう。そこで備忘録。(^_^;
＜表を作成＞
this.createGrid = function(){
$('#表のID').jqGrid( {
data : this.gridData, // 配列要素が格納された２次元配列
datatype : 'local',
colNames : [ '項目１', '項目２', '項目３', '項目４' ],
colModel : [
{name : 'no1', width : 50, sorttype : 'int', align : 'right'},
{name : 'no2', width : 80, sorttype : 'str', align : 'center'},
{name : 'no3', width : 80, sorttype : 'str', align : 'center'},
{name : 'no4', width : 80, sorttype : 'str', align : 'left'}
],
width : 390,
height : 250,
rowNum : 30,
rownumbers : true,
onSelectRow : function(id) {
var grid = $("#表のID").jqGrid("getRowData",id);
alert(grid.no1); // 選択した行の項目1の内容を表示する
},
gridview : true,
viewrecords : true,
caption: '表のタイトル',
pager : 'ページャー要素のID'
});
};
と宣言して表を作成するメソッドを作成。
この表を更新する方法として２パターンある。
１．グリッドを初期化して１行１行追加する方法
速度的に使い物にならない！特に行数が多い場合は終わってる・・・。
コマンドは以下の通り。
$("#表のID").clearGridData(); // 表を初期化するコマンド
$("#表のID").jqGrid("addRowData",行番号,'その行の配列(no1,no2,no3,no4)'); // 行を追加するコマンド
２．表を削除して再作成する方法
お勧めはこちら。一回表を削除して２次元配列を "data"で宣言している２次元配列に渡してしまう。
具体的には、
$("#表のID").GridUnload(); // 表を削除
this.gridData = []; // 変数を初期化
this.gridData = 取得した２次元配列; // 変数を設定
this.createGrid();
これで
処理速度は１０倍～１００倍くらい早くなります。ラッキー！
TRDI ｷﾀ━━━(ﾟ∀ﾟ)━━━!!!
