<li> <label>所屬省市:</label> <select name="province" id="province" class="sec" onchange="showNext(this.value);"> <option value="">請選擇</option> <c:choose> <c:when test="${not empty provList}"> <c:forEach items="${provList}" var="prov"> <option value="${prov.area_id }" <c:if test="${prov.area_name == notice.province}">selected="selected"</c:if>> ${prov.area_name} </option> </c:forEach> </c:when> </c:choose> </select> </li> <li><label>所屬城市:</label> <select name="city" id="city" class="sec"> <option value="" <c:if test="${'' == notice.city or null == notice.city}">selected="selected"</c:if>> 請選擇 </option> <c:choose> <c:when test="${not empty cityList}"> <c:forEach items="${cityList}" var="city" > <option value="${city.area_name }" <c:if test="${city.area_name == notice.city}">selected="selected"</c:if>> ${city.area_name } </option> </c:forEach> </c:when> </c:choose> </select> </li>
//聯動顯示城市下拉框 function showNext(id){ $("#city").empty(); if(id!=null && id!=""){ var url = "<%=path%>/area/sub.do?"; $.ajax({ type : 'POST', url : url, data :{ "areaId":id }, dataType: "json", success : function(data){ if(data.areaList.length>0){ $("#city").append("<option value=''>請選擇</option>"); $.each(data.areaList,function(i){ $("#city").append("<option value='"+this.area_name+"'>"+this.area_name+"</option>"); }); }else{ $("#city").append("<option value='-1'>無數據</option>"); } }, error : function(data){ alert("出現未知異常,請聯繫管理員"); return false; } }); }else{ $("#city").val(""); } }