やってみよう!DWS(第6回)
それでは前準備といきましょう!!
どうも数回ぶりのご無沙汰です。
まず、お知らせですが1月24日にDWSのパワーアップを行いました
パワーアップに伴って、DWSのURLが変更になります。(パラメータ引数は
同じです)。
まだ、現行DWSをお使いの方が多いと思いますので是非週末にでも
変更してくださいませ。
今回のパワーアップでは商品検索のAND検索を行うことができます。
よろしくお願いいたします。
では本題に移りましょう!!
前回ではAJAXというのは決して新しい技術ではありません。
ということを申しました。
AJAXというのは基本的にはJavascriptというスクリプト言語を利用して、
XMLを読み込み、加工することが基本になっています。
これをよく使っているのがGoogleで最近検索以外のウェブアプリケーションで
かなり頻繁に利用されています。
新しい技術ではないので、比較的安定的に支持されている技術を使うということも
大きな話題になっているのでしょうか?
http://www.google.com/webhp?complete=1&hl=ja
↑このページは普通のGoogleと違って検索結果の断片から該当すると思われる
検索語をあらかじめ教えてくれる機能が備わったページです。
検索予想とそれに対する結果レコード数をXMLで受け取りながら表示しているのでしょう。
このセレクターがAJAXの概念で用いられているものです。
今回はこのようなものではなく、検索語を入力して、ボタンをクリックすると
その下に結果を表示するものを作りたいと思います。
その前に!
ここからのファイルの保存に関しては”UTF-8”という文字コードを利用していきます。
これはDWSで使われている文字コードにあわせることになっていますので。
通常のファイルであると必ず文字化けしますので注意してください!
それではまずHTMLファイルを作っていきましょう
HTMLといっても今回はXHTMLというものを使っていきます。
まずdws.htmlというファイルを作ってみましょう
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>CGIなしでのDWS利用の限界にチャレンジ!!</title>
<link href="./common.css" rel="stylesheet" type="text/css" />
<link href="./xml.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="./getxml.js"></script>
</head>
<body>
<h1>CGIなしでDWSを利用してみる</h1>
<p>"XML読込"ボタンを押すと、画面下にXMLデータの内容が組み込まれます。</p>
<p><input type="button" name="loadBtn" value="DWSデータ読込" id="loadBtn" /></p>
<div id="displayframe">
<div id="dataframe" class="dataframe">
<span></span> <span></span> <span></span>
</div>
</div>
</body>
</html>
もちろんこのままではうまくいきませんので
スタイルを決めるスタイルシートと制御を行うスクリプトを作成しなければいけませんが
おっと!時間となりました。
続きは次回に
次回はいよいよDWSを利用することができるところまで一気にいきます
お楽しみに!!

