[Wicket] Ajax更新後にJavaScriptを実行する
Wicketでは、Ajax更新後にJavaScriptを実行する方法がいくつかあるようです。
今回は役に立ちそうな3種類の方法についてまとめたいと思います。
ちなみにWicketのバージョンは1.5.2です。
1. AjaxRequestTargetにJavaScriptを追加する
もっとも頻繁に使う方法です。
各コンポーネントのonEventやAjaxLinkのonClickなど、イベントハンドラが呼び出された時の引数にAjaxRequestTargetがあります。このAjaxRequestTargetのappendJavaScriptを呼び出すことによって、Ajax更新後に実行されるJavaScriptを記述することが出来ます。
AjaxLink<Void> link = new AjaxLink<Void>("link") {
@Override
public void onClick(AjaxRequestTarget target) {
target.appendJavaScript("alert('update complete!');");
}
};
AjaxLinkを使用した例ですが、4行目のようにappendJavaScriptを使って実行したいJavaScriptを追加します。
上記の例では、ページ更新後にダイアログが表示されます。
2. getAjaxCallDecoratorをオーバーライドする
ちょっと面倒な方法になりますが、上記の方法とは別に、匿名クラス(無名クラス)を使用して、getAjaxCallDecoratorをオーバーライドする方法があります。
new AjaxLink<Void>("link") {
protected onClick(AjaxRequestTarget target) { }
@Override
protected IAjaxCallDecorator getAjaxCallDecorator() {
return new AjaxCallDecorator() {
@Override
public CharSequence decorateScript(Component c, CharSequence script) {
return super.decorateScript(c, "alert('update complete!'); " + script);
}
};
}
}
まず、AjaxLinkのgetAjaxCallDecoratorをオーバーライドし、実行したいJavaScriptを追加したAjaxCallDecoratorを戻り値として返します。
AjaxCallDecoratorでは、decorateScriptというメソッドをオーバーライドし、その内部で実行したいJavaScriptを記述します。decorateScriptの第二引数のscriptには、本来Ajax更新で実行されるべきJavaScriptが記述されていますので、実行したいJavaScriptを記述したあと、scriptをその後に追加するようにしてください。
3. wicketGlobalPostCallHandlerに関数を代入する
最後に、wicketGlobalPostCallHandlerへ関数を登録する方法です。こんな方法があったのか、的なやり方ですが、上記の2つに比べると非常に簡単に使うことが出来ます。
このwicketGlobalPostCallHandlerは、JavaではなくJavaScript側に記述します。"Global"とあるように、全てのAjax更新に対して処理を行うことができるので、例えば更新対象にjQueryプラグインを適用したい場合などに非常に便利です。
wicketGlobalPostCallHandler = function(){
alert('update complete!');
};
上記のコードを、JavaScript側に記述します。これでAjax更新後にダイアログが表示されます。
また、このコードは特定のコンポーネントの更新時ではなく、ページ内に存在するコンポーネントのいずれかが更新された時に毎回呼び出されます。
僕が普段使う方法は以上の3つです。多分他にもやり方はあると思うので、知ってる方はコメントにでも書いてくれるとありがたいです。
0 件のコメント :
コメントを投稿