Yahoo! User Interface Library使ってみたのでメモ

http://developer.yahoo.com/yui/
Dialog上で入力とかやるのを作りたくて，Yahoo! User Interface Library，いわゆるYUIを使ってみた．

Event，Dialogあたりのサンプルを組み合わせたらやりたいことはできた．モーダルウィンドウみたいなのもサポートされてるので丁度よかった．他のライブラリでも同じようなことできるのありそうだけど，とりあえずググってYUIが目に付いたので使った．

• prototype.jsでAjax.Request使って，帰ってきた値を$("id").innerHTMLに．
• 5個くらいのリストが帰ってきて，それぞれボタンが付いてる
• ボタン押したら各パラメータが埋め込まれたダイアログ表示

<div id="result">
</div>

var dialog1 = new YAHOO.widget.Dialog("dialog1", 
	{ width : "30em",
	  modal: true,
	  fixedcenter : true,
	  visible : false, 
	  constraintoviewport : true,
	  buttons : [ { text:"Submit", handler:handleSubmit, isDefault:true },
		      { text:"Cancel", handler:handleCancel } ]
	});

YAHOO.util.Event.on("result", "click", function(e){
	var elTarget = YAHOO.util.Event.getTarget(e);	
	while (elTarget.id != "result") {
		if(elTarget.nodeName.toUpperCase() == "LI") {
			dialog1.show();
			break;
		} else {
			elTarget = elTarget.parentNode;
		}
	}
});