ダウンロード サンプルファイル (19.8 MB)
本稿ではStruts 2にjQueryとjQuery UIを使ったリッチクライアントを提供するStruts 2 jQueryプラグインを紹介します。
はじめに
本稿ではStruts 2にjQueryとjQuery UIを使ったリッチクライアントを提供するStruts 2 jQueryプラグインを紹介します。
jQueryとjQuery UIについて
jQueryとはJavaScriptとHTML、CSSの相互作用を強化する軽量なJavaScriptライブラリです。軽量ながらも簡単な操作で扱え、HTMLの操作、AJAXによる非同期リクエストも扱えるのが特徴です。
jQuery UIとは、jQueryの公式ユーザインターフェイス群です。ボタンやタブ表示など基本的なものから、カレンダーやカラーピッカーのような良く使われるユーザインターフェイスを提供します。なお、CSSのテンプレートも提供します。
対象読者
Struts 2のWebアプリケーション開発に興味ある方。
必要な環境
最低動作環境は以下のとおりです。
- Java SE 5
- Struts 2.1.8.1が動作する環境
- Tomcat 5.5.x / 6.0.x
Struts 2 jQuery プラグインとは
Struts 2 jQuery プラグインとは、Struts 2アプリケーションで扱う画面、例えばJSP上でjQuery、jQuery UIを扱えるようにしたものです。バージョンアップの頻度もかなり高く、さらにはjQuery UI以外にも外部のjQuery用のプラグインを取り込んで、さらなるユーザインターフェイスの強化が図られています。
今回は執筆時点での最新版である2.3.1で解説します。
Struts 2 jQuery プラグインでできること
Struts 2 jQuery プラグインを導入することで、JSPでのjQueryの導入はもちろんのこと、利用できる機能はたくさんあります。
Struts 2 jQuery プラグインで提供されていないものでも、カスタマイズしたスクリプトはもちろんのこと、追加したjQueryのプラグインも利用することができます。現在の最新版ではグリッド機能とリッチなユーザインターフェイスが手軽に使えるようになり、さらにAJAX通信を利用した画面もjQueryのコードを記述することなく利用することができるというメリットもあります。もちろんStruts 2がもっていた従来の機能も損なうことがありません（※1）。
本稿ではこのプラグインの基本的な使い方を、1つの入力画面を通して紹介していきます。
以下の表に、ウィジェット一覧と、インタラクション（段落の操作）一覧をまとめます。公式の機能一覧はStruts 2 jQuery Pluginならびに実際に動作するサンプルアプリケーションとしてStruts 2 jQuery Plugin Showcaseで公開されていますので参考にしてください。
AJAXを利用したValidation機能もそのまま利用することができ、2.0系、2.1系で不具合として報告されていた、AJAXValidationのメッセージが国際化対応されていない問題も解消されています。
| 機能名 | 概要 |
| TabbedPanel | 複数タブ形式の表示。選んだタブの内容を表示する。 |
| Datepicker | カレンダーを利用した日付入力機能。 |
| Dialog | ダイアログボックスを表示。 |
| Accordion | 複数の段落の中から選択した段落をスライドさせて表示。 |
| Autocompleter | テキストボックスで入力された値を検出して、候補を出力するサジェスト機能。 |
| Button | フォーム送信用ボタン/リンク作成。 |
| Buttonset | チェックボックスやラジオボタンのように扱えるボタンを表示。 |
| Progressbar | 処理の進行度合を表示するUIを表示。 |
| Slider | 入力する数値をツマミで選択させるUIを表示。 |
| Grid | 表形式の出力を行う。ページングやソート、データの抽出、登録、更新、削除機能のUIを搭載。 |
| Richtext Editor | テキストエリアで動的にHTMLのスタイルや段落作成ができるテキストエディタ。 |
| 機能名 | 概要 |
| Resizable | プレビュー機能付きの段落サイズ変更。 |
| Drag and Drop | 段落をドラッグ＆ドロップして、別の場所や別の段落の中へ移動可能にする。 |
| Selectable | 複数の段落をグルーピングして選択/非選択状態を検出する。 |
| Sortable | 配置された複数の段落の中から1つをドラッグして並び替えが可能になる。 |
この記事は参考になりましたか？
- 続 Struts 2入門連載記事一覧
-
- Strutsプラグインで単体テストからレポート作成、共通デザインの作成まで - JUnit...
- Struts 2で手軽にJSONレスポンスを扱う「Struts 2 JSONプラグイン」
- Struts 2にリッチUIを提供する「Struts2 jQueryプラグイン」
- この記事の著者
-
山田 祥寛（ヤマダ ヨシヒロ）
静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ（Java・C#・Python・PHP・Ruby・JSP＆サーブレットなど）」「速習シリーズ（ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど）」「改訂3版JavaScript本格入門」「これからはじめるLaravel実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数。
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
-
WINGSプロジェクト 東 浩二（アズマ コウジ）
＜WINGSプロジェクトについて＞有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ（代表 山田祥寛）。主にWeb開発分野の書籍／記事執筆、翻訳、講演等を幅広く手がける。 2026年時点での登録メンバは約50名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書、記事多数。 RSS X: @WingsPro_info（公式）、@WingsPro_info/wings（メンバーリスト） Facebook
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
この記事は参考になりましたか？
この記事をシェア
