人気ブログランキング | 話題のタグを見る

Dojo で JSON の通信を処理する。

Dojo では JSON のデータも Ajax で通信することが出来る。その場合、JSONのデータはパースされてオブジェクトとして取り出される。handleAs 属性を json にするとことがテキストデータの Ajax と違うだけで、後は同じような処理で対処できる。次の hello_json.txt と hello_json.html の二つのファイルで実験できる。

hello_json.txt

{"fruits": [
    {"name": "orange", "color": "orange"},
    {"name": "apple", "color": "red"},
    {"name": "grapes", "color": "purple"}
    ]
}

hello_json.html (onClickは全角英数)

<html>
<head>
<title>Hello, Ajax world!</title>
<script type="text/javascript"
    src="http://o.aolcdn.com/dojo/0.9.0/dojo/dojo.xd.js"></script>
<script type="text/javascript">
    function hello() {
        dojo.xhrGet( {
            url: "http://localhost/Dojo/dijit_samples/hello_json.txt",
            handleAs: "json",
            timeout: 5000, // Time in milliseconds
            load: function(response, ioArgs) {
                dojo.byId('cargo').innerHTML = response.fruits[0].name;
                return response;
            },
            error: function(response, ioArgs) {
                console.error("HTTP status code: ", ioArgs.xhr.status);
                return response;
            }
        });
    }
</script>
</head>

<body>
<button onClick="hello()">Click Me</button>
<div id="cargo" style="font-size: xx-large"> </div>
</body>
</html>

JSON のAjax通信もこのように簡単に出来るが、dojo.data.ItemFileReadStore() アダプタを使ったほうがもっと簡単に出来るかもしれないという気がする。使い方の解説をまだよく読んでないので良く分からないのだが、データベースとのアクセスもこのアダプターでやるようなことが書いてあるので、Ajax も可能なのではないだろうか。

そうなると、Ajaxを利用するリッチクライアントがレゴのブロックを組むみたいにほとんどコピベで作れることになる。うへっ。
by tnomura9 | 2007-11-24 19:16 | Dojo | Comments(0)
<< dojo.data Dojo の Ajax >>