minimize

事業拡大のため、新しい仲間を募集しています。
→詳しくはこちら

AjaxClassの作成

では早速AjaxClassを作成してみましょう。
DWRで使用するクラスは全てPOJOですので
特別なクラスやインターフェイスの定義は必要ありません。

package pack1;

public class AjaxClass {
    public void testFunc() {
        System.out.println("Call testFunc().");
    }
}

このtestFuncメソッドをHTMLから呼び出すには
JavaScript内で以下のように記述します。

AjaxClass.testFunc();

見ての通り、そのまんまです。
一応言っておきますが、上のコードはJavaコードではなく
JavaScriptコードです。
このように、DWRでは一般のJavaScript関数を呼び出すようにして
Javaコードのメソッドをコール出来ます。

ただし、一つだけ異なる点があります。
上のコードでtestFuncメソッドを呼び出した後、
JavaScript内ではすぐに処理が返ってきます。
例えば、

AjaxClass.testFunc();
alert("testFunc()");

のようなコードを記述した場合、
testFuncメソッドの呼び出しに10秒掛かったとしても
すぐに直後のalert文が実行されます。
これが、Ajaxが「非同期」と呼ばれる所以です。

引数を渡す

上で紹介した例は、引数も持たず戻り値も持たない一番シンプルな形です。
実際にはこういった形でAjaxが使われるケースは少なく
何らかの引数を渡すことになります。

public class AjaxClass {
    public void sendMessage(String message) {
        System.out.println("send message : " + message);
    }
}

呼び出し側は以下のようになります。

<input type="text" id="message">
<input type="button" value="メッセージ送信" onclick="sendMessage()">
<script>
function sendMessage() {
    var el = document.getElementById("message");
    AjaxClass.sendMessage(el.value);
}
</script>

入力欄にメッセージを入力して「メッセージ送信」ボタンを押下すると
サーバにそのメッセージが送信されます。

戻り値を受け取る

Ajaxの核となるのがここです。
サーバからの戻り値を取得します。

public class AjaxClass {
    public String getMessage(String message) {
        return "message = " + message);
    }
}

呼び出し側は以下のようになります。

<input type="text" id="message">
<input type="button" value="メッセージ送信&受信" onclick="sendMessage()">
<script>
function sendMessage() {
    var el = document.getElementById("message");
    AjaxClass.sendMessage(el.value, retSendMessage);
}
function retSendMessage(message) {
    alert(message);
}
</script>

入力欄にメッセージを入力して「メッセージ送信&受信」ボタンを押下すると
サーバにそのメッセージが送信され、戻り値が返されます。
その結果をalertでポップアップダイアログに表示します。

今までより少し複雑な作りになっているので説明します。
普通に考えれば、上の処理は

function sendMessage() {
    var el = document.getElementById("message");
    var message = AjaxClass.sendMessage(el.value);
    alert(message);
}

と簡単に書けそうですが、Ajaxの「非同期」という特性上そのように書けません。
AjaxClass.sendMessage(el.value) は呼び出し後、(サーバからの返答を待たずに)
処理がすぐ戻ってきてしまう為、この関数からの戻り値を直接受け取れないのです。

代わりに、コールバック関数を定義して
その関数を非同期で呼び出すことで処理を実現しています。
コールバック関数(上の例ではretSendMessage)は、サーバから処理が返ってきた段階で
初めて実行されます。
ここが少しとっつきにくい部分ですので、慣れるようにしましょう。

戻り値にBeanを使う

上の例では、戻り値の型がStringだったので
特別な処理は必要ありませんでした。
独自Beanを戻り値として使う場合には、いくつかの手順を踏む必要があります。

まずは、DWRの設定方法 で説明したように
WEB-INF/dwr.xml にBeanクラスを定義します。
Beanクラスは、以下のようにします。

package pack1;

public class AjaxBean {
    ...
    public String getName() { ... }
    public int getNumber() { ... }
}

これを使うAjaxClassを以下のように作成します。

public class AjaxClass {
    public AjaxBean getBean() {
        return new AjaxBean(...);
    }
}

呼び出し側は以下のようになります。

<input type="button" value="Bean取得" onclick="getBean()">
<script>
function getBean() {
    AjaxClass.getBean(retGetBean);
}
function retGetBean(bean) {
    alert("Bean名 : " + bean.name + ", Bean番号 : " + bean.number);
}
</script>

簡単ですね。
一つ注意点があります。
getterメソッドの戻り値は String または int にする必要があります。
short などには対応していません。