Dojoのcombobox
Dojoでcomboboxを設定してみる。
まず、Dojoのダウンロード
http://dojotoolkit.org/downloads
から、Dojo Toolkit 1.2.3: Dojo + Dijit + DojoXをダウンロードし、展開する。
展開すると、
- dijit
- dojo
- dojox
という3つのフォルダができる。
同じ階層に、以下のHTMLを置くとコンボボックスができる。これはマニュアル通り(http://dojotoolkit.org/book/dojo-book-0-9/part-2-dijit/form-validation-specialized-input/auto-completer)のHTMLだが、cssやJavaScriptのファイルはローカルを見るように変更している。また、JavaScriptファイルの読み込みで、dojo/dojo.xd.jsとなっているが、ここはdojo/dojo.jsとしている。一応ネットワーク越しにアクセスされても困るのでネットワークケーブルを抜いて実行してみる。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Simple ComboBox</title> <style type="text/css"> @import "dijit/themes/tundra/tundra.css"; @import "dojo/resources/dojo.css" </style> <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad: true"></script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dijit.form.ComboBox"); function setVal1(value) { console.debug("Selected "+value); } </script> </head> <body class="tundra"> <select name="state1" dojoType="dijit.form.ComboBox" autocomplete="false" value="California" onChange="setVal1"> <option selected="selected">California</option> <option >Illinois</option> <option >New York</option> <option >Texas</option> </select> </body></html>