ajax实现下拉框与表格中的单选按钮联动,数据从数据库中查出
js:
$(function() {
$('#userType').change(function() {
var userType = $(this).val();
$("input[type=radio]").attr("checked", false);
ajaxForAccessTypeChanged(userType, false);
});
var userType = $('#userType').val();
ajaxForAccessTypeChanged(userType, false); //当下拉框的值改变时,调用下面的方法
});
function ajaxForAccessTypeChanged(userType) {
$.ajax({
url : 'a_usr_s01_SelectedUserTypeAjaxBL.do',
type : 'post',
data : {
'userType' : userType
},
success : function(data, textStatus) {
if (data == null || data == "")
return;
var dataObj = eval("(" + data + ")");
$.each(dataObj.userTypeAccess, function(idx, item) {
if (item == null || item == "")
return;
$(
"#function_" + item.function_code + " input[value=" + item.accessType + "]").attr("checked", true);
});
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
alert("An error has occurred: " + textStatus);
}
});
}
jsp:
<logic:iterate id="listFunction" name="listFunction" scope="request">
<tr id="function_<bean:write name="listFunction" property="idFunction"/>">
<td class="tdLeft">
<bean:write name="listFunction" property="moduleName" />
<html:hidden name="listFunction" property="idModule" indexed="true" />
</td>
<td class="tdLeft">
<bean:write name="listFunction" property="functionName" />
<html:hidden name="listFunction" property="idFunction" indexed="true" />
</td>
<td class="colAccessType">
<html:radio styleId="radio" name="listFunction" property="accessType" indexed="true" value="F" />
</td>
<td class="colAccessType">
<html:radio styleId="radio" name="listFunction" property="accessType" indexed="true" value="V" />
</td>
<td class="colAccessType">
<html:radio styleId="radio" name="listFunction" property="accessType" indexed="true" value="X" />
</td>
</tr>
</logic:iterate>
BLogic:
/**
* @(#)A_USR_S01_SelectedUserTypeAjaxAction.java
*
* HMSB Online Service Booking System
*
* Version 1.00
*
* Created 2012-11-16
*
* Copyright (c) 2012 Honda Malaysia. All rights reserved.
*/
package my.com.honda.servicebooking.a_usr.action;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import my.com.honda.servicebooking.a_usr.dto.A_USR_S01_UserTypeAccess;
import jp.terasoluna.fw.dao.QueryDAO;
import jp.terasoluna.fw.service.thin.BLogicResult;
import jp.terasoluna.fw.web.struts.actions.AbstractBLogicAction;
/**
* @author i-fannch
*
*/
public class A_USR_S01_SelectedUserTypeAjaxAction<P>
extends AbstractBLogicAction<P> {
private QueryDAO queryDAO;
/* (non-Javadoc)
* @see jp.terasoluna.fw.web.struts.actions.AbstractBLogicAction#doExecuteBLogic(java.lang.Object)
*/
public BLogicResult doExecuteBLogic(P arg0) throws Exception {
BLogicResult res = new BLogicResult();
return res;
}
protected void postDoExecuteBLogic(HttpServletRequest request,
HttpServletResponse response, P params, BLogicResult result)
throws Exception {
String userType = request.getParameter("userType");
if(userType==null||userType.trim().length()<=0)
return;
List<A_USR_S01_UserTypeAccess> list = queryDAO.executeForObjectList("SELECT.A_USR.GET_LIST_ACCESSTYPE", userType);
if(list!=null&&list.size()>0) {
PrintWriter out = response.getWriter();
String json="{userTypeAccess: [";
for(A_USR_S01_UserTypeAccess ut : list)
json += "{function_code: '"+ ut.getIdFunction() +"', accessType: '"+ ut.getAccessType() +"'},";
json.substring(0, json.length()-1);
json += "]}";
out.print(json);
out.close();
}
}
public QueryDAO getQueryDAO() {
return queryDAO;
}
public void setQueryDAO(QueryDAO queryDAO) {
this.queryDAO = queryDAO;
}
}