jsonengineとExtJSはものすごく相性が良い

jsonengineとExtJSを使えば20行位のJavaScriptコードでtreeが動的に表示出来ちゃいます。勿論サーバーサイドは何も書きません。

ExtJSについてはここを参照してください。 http://extjs.co.jp/products/js/

私が書いたデモはここ。 http://uchjava.appspot.com/samples/extjs/samples/tree.html

コードはこんな感じ

Ext.onReady(function() {

	var treePanel = new Ext.tree.TreePanel( {
		dataUrl      : '/_je/testTree',
		requestMethod: 'GET',
		nodeParameter: null,
		root: {
			nodeType: 'async',
			text    : '/',
			id      : 'xxx'
		}
	});

	// event override
	treePanel.on("beforeload", function(node){
		this.loader.baseParams.cond = 'node.eq.' + node.id;
	});

	// render the tree
	treePanel.render(Ext.getBody());
	treePanel.getRootNode().expand();

});

ブラウザのデバッガで見れば分かるけど非同期にtree情報を読み込んでいます。興味ある人はデモのソースを読んでみてください。理解できたらtestTreeへ適当に情報追加したりしてもオッケー。

jQueryもいいけど標準で豊富にリソースが用意されているExtJSが断然おすすめ。

ExtJSの兄弟でSencha Touchがあるし今すぐデスクトップアプリもモバイルアプリも書けちゃうのが凄くいい。

jsonengineもExtJSも強力過ぎてウェブサービスが笑っちゃうくらい簡単に作れる時代になりました。

作者方に感謝。