プルダウンを選択したらその選択地の情報を自動表示する機能をAjaxで実装する。

pulldownSelectEventHandler.prototype = {
/**
* コンストラクタ。
* @param id XXコードテキストのid属性の値
* @param pulldownId XXプルダウンのid属性の値
* @param infoId XX情報表示(ラベル)id属性の値
* @param requestURL リクエストajaxアクション名
*/
initialize: function(id, pulldownId, infoId, requestURL) {
this.id = $(id);
this.pulldownId = $(pulldownId);
this.infoId = infoId;
this.ajaxHelper = new AjaxHelper(requestURL);
this.bind();
},
/**
* イベントをハンドリングします。
* @param event イベント
*/
handle: function(event) {
var inputedValue = $F(Event.element(event));
if (!inputedValue) {

this.pulldown.options.length = 0;
return;
}
this.id.value = inputedValue;
var ajaxHelper = this.ajaxHelper;
var info = this.infoId;
ajaxHelper.request(
{
//ここで実行するメソッドを指定します
changeXXValue: "method",
selectCondition: inputedValue
},
function(request) {
var optionsData = eval("("+ request.responseText + ")");
document.getElementById(info).innerHTML=optionsData.labelInfo;
});
},
/**
* 自分自身をバインドします。
*/
bind: function() {
this.empPulldownId.onchange = this.handle.bindAsEventListener(this);
}
}


■ページ読み込み時に登録する





{
"info":""
}


{
"info":""
}






■struts-config.xml
path="/common/common_ajax"
type="jp.co.hoge.webapp.common.ajax.CommonAjaxAction"
parameter="changeXXList"
name="commonAjaxForm"
scope="request" validate="false"
input="/WEB-INF/jsp/common/change_list_back_options.jsp">




■フォーム

/**
* サンプルAjaxフォーム。
*/
public class CommonAjaxForm extends ActionForm {

/**
* シリアルバージョン番号。
*/
private static final long serialVersionUID = -5981717958702711679L;

/**
* 検索条件。
*/
private String selectCondition;

/**
* @return 検索条件
*/
public String getSelectCondition() {
return selectCondition;
}

/**
* @param selectCondition 検索条件
*/
public void setSelectCondition(String selectCondition) {
this.selectCondition = selectCondition;
}
}


■アクション
/**
* 支払Ajaxアクション。
*/
public class CommonAjaxAction extends AjaxBaseAction {

/**
* XX選択プルダウンを変更し、XX情報を返す
*
* @param mapping マッピング
* @param form アクションフォーム
* @param request リクエスト
* @param response レスポンス
* @return actionForward
*/
public ActionForward changeEmpList(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
// フォームを取得
CommonAjaxForm castForm = (CommonAjaxForm) form;
// XXコードを取得
String xxCode = castForm.getSelectCondition();
// XX情報を取得
// ここでxxCodeを引数にサービスから情報を取得します。
String xxInfo = xxx(xxCode);
// フォームに設定
castForm.setTargetValue(xxInfo);
return mapping.findForward("xxListChg_success");
}
}


（参考）
package jp.co.common.webapp.common;

import java.util.HashMap;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.actions.DispatchAction;

/**
* Ajaxベースアクション。
*
*

以下のシステムプロパティを使用し、{@link BaseAction#dispatchMethod}メソッド
* から返されるActionForwardのパスをブラウザに対応した拡張子に変更します。
*

*
• {@link AjaxBaseAction#HEADER_USER_AGENT_NAME}

*
• {@link AjaxBaseAction#USER_AGENT_TO_EXTENSION_MAP}

*
• {@link AjaxBaseAction#JSP_EXTENSION}

*

また、{@link BaseAction#init}メソッドはAjaxで使用しないため、デフォルト
* 実装を提供し、オーバーライド不可にしています。
*/
public class AjaxBaseAction extends DispatchAction {

private static final String HEADER_USER_AGENT_NAME = System.getProperty("xxxx",
"User-Agent");

/**
* Ajaxで使用するHTTPヘッダーのUser-Agentと拡張子のマッピング。
*/
private static final Map USER_AGENT_TO_EXTENSION_MAP;

/**
* 通常のJSPの拡張子。
*/
private static final String JSP_EXTENSION = System.getProperty("xxxxx",
"jsp");

static {
USER_AGENT_TO_EXTENSION_MAP = createUserAgentToExtensionMap();
}

/**
* Ajaxで使用するHTTPヘッダーのUser-Agentと拡張子のマッピングを作成します。
*
* @return HTTPヘッダーのUser-Agentの値,拡張子のマップ
*/
private static Map createUserAgentToExtensionMap() {
Map userAgentToExtensionMap = new HashMap();
String[] userAgentToExtentionArray = System.getProperty("xxxxx",
"MSIE,ie")
.split(",");

for (int i = 0; i < (userAgentToExtentionArray.length / 2); i++) {
userAgentToExtensionMap.put(userAgentToExtentionArray[i],
userAgentToExtentionArray[i + 1]);
}

return userAgentToExtensionMap;
}

/**
* {@inheritDoc}
*
*

Ajax用アクションのためinitメソッドを使用しません。例外をスローします。
*/
@Override
public final ActionForward init(ActionMapping mapping, ActionForm form,
HttpServletRequest request,
HttpServletResponse response) {
throw new UnsupportedOperationException("Ajax用アクションのためinitメソッドを使用しません。");
}

/**
* {@inheritDoc}
* @throws Exception 例外
*/
@Override
protected final ActionForward dispatchMethod(ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response,
String name)
throws Exception {
ActionForward forward = super.dispatchMethod(mapping, form, request,
response, name);

String extension = getExtensionOrNull(request);

if (extension == null) {
return forward;
}

return new ActionForward(forward.getName(),
changeExtension(forward.getPath(), extension),
forward.getRedirect());
}

/**
* パスの拡張子を変更する。
*
*

パスが{@link AjaxBaseAction#JSP_EXTENSION}で定義された拡張子でない
* 場合は、何も処理せずに指定されたパスをそのまま返します。
*
* @param path パス
* @param extension 拡張子
* @return 拡張子が変更されたパス
*/
private String changeExtension(String path, String extension) {
int extensionStartIndex = path.lastIndexOf(JSP_EXTENSION);

return (extensionStartIndex < 0) ? path
: (path.substring(0,
extensionStartIndex) +
extension);
}

/**
* ブラウザに応じた拡張子を取得する。
*
*

{@link AjaxBaseAction#USER_AGENT_TO_EXTENSION_MAP}で定義された
* マッピングから判断します。
*
* @param request リクエスト
* @return ブラウザに応じた拡張子。見つからない場合はnull
*/
private String getExtensionOrNull(HttpServletRequest request) {
for (Map.Entry entry : USER_AGENT_TO_EXTENSION_MAP.entrySet()) {
if (request.getHeader(HEADER_USER_AGENT_NAME).indexOf(entry.getKey()) > -1) {
return entry.getValue();
}
}

return null;
}
}