AJAX实例

function changeSerive(obj){
if(obj.selectedIndex==0){   // 下拉框不选择的时候的操作
document.forms[0].cboService.selectedIndex = 0;
document.forms[0].cboService.disabled=true;

}else{

               // 下拉框选择了值,就要后台取出数据,连动到别的界面控件的值

var path = $("#rootPath").val();

var url=path+'/M_PPM/M_PPM_S04GetServiceAjax.do?cboCategory='+$(".cboCategory").val();  //  完整的URL路径

$.ajax({  //调用AJAX  2个参数 type url,  success 函数接受返回的结果,然后改变需要改变的值。   select控件的html就是option的列表
                    type: 'POST',
                    url: url,
                   success: function(listService){  //listService是返回的字符串
               $(".cboService").html(listService);
               document.forms[0].cboService.disabled=false;
               $(".cboService").attr("style","width:50%");
                    }
                 });
}

}


JSP界面的代码,加了onchange的处理:

<html:select name="_m_ppmFormS04" property="cboCategory" styleClass="cboCategory"onchange="changeSerive(this);" style="width:50%">
    <option value=""><bean:message key="screen.m_ppms02.selectone"/></option>
    <html:optionsCollection name="_m_ppmFormS04" property="cboCategoryList" label="svcGrpName" value="svcGrp"/>
 </html:select>

后台的Java代码:

import com.google.gson.Gson;

public class M_PPM_S04GetServiceAjaxAction extends ActionEx {


    /**
     * queryDAO object
     */
    protected QueryDAO queryDAO = null;
    
    /**
     * type of reponse
     */
    private static String JSON = "application/json";
    
    public ActionForward doExecute(ActionMapping mapping, ActionForm form,
            HttpServletRequest request, HttpServletResponse response)
            throws Exception {
        Gson googleSon = new Gson();
        String jsonString = "";
        
        String cboCategory = request.getParameter("cboCategory"); //获得参数
        // 获得结果集
        List<Service> cboServiceList = queryDAO.executeForObjectList("SELECT.M_PPM.S04.SERVICE", cboCategory);
        
        StringBuffer services = new StringBuffer();
        // 拼接结果字符串
        if (cboServiceList!=null && 0<cboServiceList.size() ){
            services.append("<option value=''>- Please Select One -</option>");
            for (Service service : cboServiceList) {
                services.append("<option value='")
                         .append(service.getIdService())
                         .append("'>")
                         .append(service.getSvcDesc())
                         .append("</option>");
            }
        } else {
            services.append("<option value=''>- Please Select One -</option>");
        }
        
        
        //convert the period to JSON string
        jsonString = googleSon.toJson(services.toString());
        
        // set type for the response
        response.setContentType(JSON);
        try {
            // write JSON string into the response
            response.getWriter().print(jsonString);
        } catch (IOException e) {
            e.printStackTrace();
        }
        return null;
    }
    
    public QueryDAO getQueryDAO() {
        return queryDAO;
    }


    public void setQueryDAO(QueryDAO queryDAO) {
        this.queryDAO = queryDAO;
    }
}

设置response的类型为,application/json, 用response直接写出 jsonString    rerun null   Action  当severlet 用

$.ajax   JQuery

你可能感兴趣的:(AJAX实例)