Liferay ajax调用依赖选择框

Question

我遇到这个问题，我需要用记录填充一个选择框，当我从第一个选择框中选择一个省时，第二个选择框应该动态填充该省的城市..

所以这就是我所做的，我创建了一个包含城市的表格并为此创建了一个finderImpl，这里是内容（不包括导入）

public class m_city_municipalityFinderImpl extends BasePersistenceImpl<m_city_municipality> implements m_city_municipalityFinder{
    public List<m_city_municipality> getCityMunicipalityByProvinceId(long province_id){
        Session session = null;
        try{
            session = openSession();
            String sql = CustomSQLUtil.get("cityMunicipalitySQLQuery");
            SQLQuery queryObject = session.createSQLQuery(sql);
            queryObject.setCacheable(false);
            queryObject.addEntity("m_city_municipality", m_city_municipalityImpl.class);
            QueryPos queryPos = QueryPos.getInstance(queryObject);
            queryPos.add(province_id);

            return (List<m_city_municipality>) queryObject.list();
        }catch(Exception e){
            e.printStackTrace();
        }finally{
            closeSession(session);
        }
        return null;
    }
}

然后我使用了liferay的内置函数来使用AUI实现ajax，这里是我的jsp和action portlet中的代码

JSP （脚本写在底部）

<%@page import="com.sampleportlet.services.service.m_provinceLocalServiceUtil"%>
<%@page import="com.sampleportlet.services.model.m_province"%>
<%@page import="com.liferay.portal.kernel.servlet.SessionErrors"%>
<%@page import="com.liferay.portal.kernel.servlet.SessionMessages"%>
<%@page import="com.sampleportlet.services.model.personal_contact_present" %>
<%@page import="com.sampleportlet.services.service.personal_contact_presentLocalServiceUtil" %>
<%@page import="com.sampleportlet.services.model.personal_contact_permanent" %>
<%@page import="com.sampleportlet.services.service.personal_contact_permanentLocalServiceUtil" %>
<%@page import="com.sampleportlet.services.model.business_contact" %>
<%@page import="com.sampleportlet.services.service.business_contactLocalServiceUtil" %>
<%@page import="com.liferay.portal.service.ServiceContext" %>
<%@page import="com.liferay.portal.service.ServiceContextThreadLocal" %>
<%@page import="javax.portlet.PortletURL"%>
<%@page import="com.liferay.portal.kernel.util.Validator"%>
<%@page import="java.util.List"%>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://alloy.liferay.com/tld/aui" prefix="aui"%>

<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<script src="js/jquery.js" type="text/javascript"></script>

<portlet:defineObjects />

<portlet:actionURL var="ADDFClassActionURL" windowState="normal" name="saveContactDetails">
</portlet:actionURL>

<portlet:resourceURL var="resourceURL" ></portlet:resourceURL>

<% if(SessionMessages.contains(renderRequest.getPortletSession(),"success")){%>
<liferay-ui:success key="success" message="Information has been successfully updated." />
<%} %>
<% if(SessionErrors.contains(renderRequest.getPortletSession(),"error")){%>
<liferay-ui:error key="error" message="There is an Error occured while updating your record. Please try again" />
<%} %>

<form action="<%=ADDFClassActionURL%>" name="contactDetails_form" method="POST" role="form">
<div class="main-content-body">
    <center><h3>APPOINTIVE DIRECTOR DATA FORM</h3></center>
    <div class=" row main-form">
        <h5 class="header">Personal Contact Details</h5>
        <div class="col-md-12 header"><strong>PRESENT ADDRESS</strong></div>
        <div class="col-md-6">
            <div class="form-group">
                <label for="pres_home_no_street"><span>* </span>Home No. &amp; Street</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>pres_home_no_street" id="<portlet:namespace/>pres_home_no_street" value="<%= pres_home_no_street%>">
             </div>
             <div class="form-group">
                <label for="pres_province"><span>* </span>Province</label>
                <select class="form-control medium" name="<portlet:namespace/>pres_province" id="<portlet:namespace/>pres_province" value="<%= pres_province %>">
                <%
                    java.util.List<m_province> provinceList = m_provinceLocalServiceUtil.getm_provinces(0, m_provinceLocalServiceUtil.getm_provincesCount());
                    for (m_province i : provinceList) {
                %>
                    <option value="<%=i.getProvince_id()%>"><%=i.getProvince()%></option>
                <%
                    }
                %>
                </select>

             </div>
             <div class="form-group">
                <label for="pres_city_municipality"><span>* </span>City/Municipality</label>
                <select class="form-control medium" name="<portlet:namespace/>pres_city_municipality" id="<portlet:namespace/>pres_city_municipality" value="<%= pres_city_municipality %>"></select>
             </div>
        </div>
        <div class="col-md-6" style="vertical-align:top;">
            <div class="form-group">
                <label for="pres_zipcode">Zip Code</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>pres_zipcode" id="<portlet:namespace/>pres_zipcode" value="<%= pres_zipcode %>">
             </div>
             <div class="form-group">
                <label for="pres_telno"><span>* </span>Tel. No.</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>pres_telno" id="<portlet:namespace/>pres_telno" value="<%= pres_telno %>">
             </div>
        </div>
        <div class="col-md-12 header"><strong>PERMANENT ADDRESS</strong></div>
        <div class="col-md-6">
            <div class="form-group">
                <label for="perm_home_no_street"><span>* </span>Home No. &amp; Street</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>perm_home_no_street" id="<portlet:namespace/>perm_home_no_street" value="<%= perm_home_no_street %>">
             </div>
             <div class="form-group">
                <label for="perm_province"><span>* </span>Province</label>
                <select class="form-control medium" name="<portlet:namespace/>perm_province" id="<portlet:namespace/>perm_province" value="<%= perm_province %>"  onchange="listMunicipality(this)">
                <%
                    for (m_province i : provinceList) {
                %>
                    <option value="<%=i.getProvince_id()%>"><%=i.getProvince()%></option>
                <%
                    }
                %>
                </select>
             </div>
             <div class="form-group">
                <label for="perm_city_municipality"><span>* </span>City/Municipality</label>
                <select class="form-control medium" name="<portlet:namespace/>perm_city_municipality" id="<portlet:namespace/>perm_city_municipality" value="<%= perm_city_municipality %>"  onchange="listMunicipality(this)"></select>
             </div>
             <div class="form-group">
                <label for="perm_email"><span>* </span>Email Address</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>perm_email" id="<portlet:namespace/>perm_email" value="<%= perm_email %>">
             </div>
        </div>
        <div class="col-md-6" style="vertical-align:top;">
            <div class="form-group">
                <label for="perm_zipcode">Zip Code</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>perm_zipcode" id="<portlet:namespace/>perm_zipcode" value="<%= perm_zipcode %>">
             </div>
             <div class="form-group">
                <label for="perm_telno">Tel. No.</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>perm_telno" id="<portlet:namespace/>perm_telno" value="<%= perm_telno %>">
             </div>
             <div class="form-group">
                <label for="perm_celno"><span>* </span>Cel. No.</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>perm_celno" id="<portlet:namespace/>perm_celno" value="<%= perm_celno %>">
             </div>
        </div>
        <div class="col-md-12 header"><strong>BUSINESS CONTACT DETAILS</strong></div>
        <div class="col-md-6">
            <div class="form-group">
                <label for="bus_company_name">Company Name</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_company_name" id="<portlet:namespace/>bus_company_name" value="<%= bus_company_name %>">
             </div>
             <div class="form-group">
                <label for="bus_address">Permanent Address</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_address" id="<portlet:namespace/>bus_address" value="<%= bus_address %>">
             </div>
             <div class="form-group">
                <label for="bus_email">Email Address</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_email" id="<portlet:namespace/>bus_email" value="<%= bus_email %>">
             </div>
        </div>
        <div class="col-md-6" style="vertical-align:top;">
            <div class="form-group">
                <label for="bus_personal_telno">Tel. No</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_personal_telno" id="<portlet:namespace/>bus_personal_telno" value="<%= bus_personal_telno %>">
             </div>
             <div class="form-group">
                <label for="bus_telno">Tel. No.</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_telno" id="<portlet:namespace/>bus_telno" value="<%= bus_telno %>">
             </div>
             <div class="form-group">
                <label for="bus_celno">Cel. No.</label>
                <input type="text" class="form-control medium" name="<portlet:namespace/>bus_celno" id="<portlet:namespace/>bus_celno" value="<%= bus_celno %>">
             </div>
        </div>
    </div>
</div>

<aui:script>
AUI().use('aui-base','aui-io-request','aui-node', function(A){
    A.one("#<portlet:namespace/>pres_province").on('change',function(){       
        A.io.request('<%=resourceURL%>', {
             method: 'POST',
             data: { 
                "<portlet:namespace/>provinceName" : A.one("#<portlet:namespace/>pres_province").val()
             },
             dataType: 'json',
             on: {
                 success: function() {
                    var citiesList =this.get('responseData');   //on success fuction we will get response data
                    A.one('#<portlet:namespace />pres_city_municipality').empty();
                    //using for loop we iterating the list
                    for(var i in citiesList){
                        A.one('#<portlet:namespace />pres_city_municipality').append("<option value='"+ citiesList[i] +"' >"+citiesList[i]+"</option> ");
                    }
                }
            }
        });
    });
    A.one("#<portlet:namespace/>perm_province").on('change',function(){       
        A.io.request('<%=resourceURL%>', {
             method: 'POST',
             data: { 
                "<portlet:namespace/>provinceName" : A.one("#<portlet:namespace/>perm_province").val()
             },
             dataType: 'json',
             on: {
                 success: function() {
                    var citiesList =this.get('responseData');   //on success fuction we will get response data
                    A.one('#<portlet:namespace />perm_city_municipality').empty();
                    //using for loop we iterating the list
                    for(var i in citiesList){
                        A.one('#<portlet:namespace />perm_city_municipality').append("<option value='"+ citiesList[i] +"' >"+citiesList[i]+"</option> ");
                    }
                }
            }
        });
    });
});
</aui:script>



<div class="buttons">
    <button id="edit" class="edit">Edit</button>
    <input class="save" type="submit" name="saveContactDetails" id="saveContactDetails" value="Save"/>
</div>
</form>

动作Portlet类（仅写为serveResource方法）

public static Log log = LogFactoryUtil.getLog(ActionClass.class);

    @Override
    public void serveResource(ResourceRequest resourceRequest, ResourceResponse resourceResponse) throws IOException, PortletException {
        try {

            //contact details
            String provinceName = ParamUtil.getString(resourceRequest, "provinceName");
            log.info("PROVINCE HERE::::::>>>>>>>>>>>>>>>>> "+ provinceName);
            System.out.println("PROVINCE HERE::::::>>>>>>>>>>>>>>>>> "+ provinceName);

            JSONArray city_municipalityArray = JSONFactoryUtil.createJSONArray();
            List<m_city_municipality> citiesList = m_city_municipalityFinderUtil.getCityMunicipalityByProvinceId(Long.parseLong(provinceName));

            System.out.println(citiesList);
            for(m_city_municipality m : citiesList){
                city_municipalityArray.put(m.getCity_municipality());
            }

            PrintWriter writer = resourceResponse.getWriter();
            writer.write(city_municipalityArray.toString());
            writer.println(city_municipalityArray.toString());
            writer.flush();
        } catch (Exception e) {
            e.printStackTrace();
            log.error(e);
        }
    }

我运行了这个，但我得到的是一个空指针异常，并且组合框显示奇怪的东西，抱歉我没有足够的声誉来附加它的图像..

这似乎是我的问题？你能指出我的代码有什么问题吗？