springmvc+ajax實現省市區三級聯動以及406 (Not Acceptable)的解決辦法
阿新 • • 發佈：2019-01-03
我做一個小的測試實現功能
最主要是說一下遇到的問題：
我先用的spring3.2的包但是遇到好多的問我問題，
（1）首先就是不能使用*.htm,*.html的地址字尾；
（2）這個會報406 (Not Acceptable)的錯誤：
辦法：1.你可以換成4.0的包，然後就能支援*.htm的字尾了；2.看看你的json包導進去沒jackson-annotations-2.7.0.jar ，jackson-core-2.7.0.jar ，jackson-databind-2.7.0.jar；
3.在spring配置檔案中加入以下程式碼
<bean id="mappingJacksonHttpMessageConverter" class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"> <property name="supportedMediaTypes"> <list> <value>text/html;charset=UTF-8</value> </list> </property> </bean> <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"> <property name="messageConverters"> <list> <ref bean="mappingJacksonHttpMessageConverter" /><!-- json轉換器 --> </list> </property> </bean>
下面是實現的程式碼：
1.首先建立頁面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>個人網站</title> <script type="text/javascript"> function select(){ var praviceID = $("#sheng").val(); $.ajax({ url:"sheng.htm", type:"POST", //contentType:"application/json", dataType:"json", data:{"pravice":praviceID}, success:function(data){ $("#shi").html("");//先清空 //遍歷傳過來的list集合 $.each(data,function(i,sheng){ $("#shi").append( "<option value='"+sheng.id+"'>"+sheng.name+"</option>" ) }) } }); }; function select1(){ var shengID = $("#shi").val(); $.ajax({ url:"sheng1.htm", type:"POST", dataType:"json", data:{"sheng":shengID}, success:function(data){ $("#qu").html(""); $.each(data,function(i,qu){ $("#qu").append( "<option value='"+qu.id+"'>"+qu.name+"</option>" ) }) } }); }; </script></head> <body data-spy="scroll" data-target=".navbar" data-offset="50"> <div> <h1>省市區三級聯動</h1> 省份: <select id="sheng" onchange="select()"> <option value="">-請選擇-</option> <!-- 迴圈顯示所有省份 --> <c:forEach items="${list}" var="pv" > <option value="${pv.id}">${pv.name}</option> </c:forEach> </select> 城市: <select id="shi" onchange="select1()"> <option value="">-請選擇-</option> </select> 區域: <select id="qu"> <option value="">-請選擇-</option> </select> </fieldset> </div> </body> </html>
2.後臺程式碼：
controller層：
@Controller
public class LoginController {
@Autowired
private ShengService ss;
@Autowired
private PraviceService ps;
@RequestMapping("/wel.htm")
public String getWel(HttpServletRequest req)
{
log.info("初始化頁面.................");
List<Pravice> list = ps.getId();
req.setAttribute("list", list);
return "index";
}
@RequestMapping("/sheng.htm")
@ResponseBody
public List<Sheng> getS(@RequestParam(value = "pravice")int praviceID){
System.out.println(praviceID);
List<Sheng> name = ss.getSheng(praviceID);
for(Sheng s:name){
System.out.println(s.getName());
}
return name;
}
@RequestMapping("/sheng1.htm")
@ResponseBody
public List<Sheng> getQ(@RequestParam(value = "sheng")int shengID){
System.out.println(shengID);
List<Sheng> name = ss.getSheng(shengID);
for(Sheng s:name){
System.out.println(s.getName());
}
return name;
}
} dao層
public interface ShengDao {
@Select("select id,name,father from sheng where father=#{father}")
List<Sheng> getSheng(int father);
}public interface PraviceDao {
@Select("select id,name from pravice")
List<Pravice> getPravice();
}service層
@Service
public class ShengService {
@Autowired
private ShengDao sd;
public List<Sheng> getSheng(int id){
List<Sheng> s = sd.getSheng(id);
return s;
}
}@Service
public class PraviceService {
@Autowired
private PraviceDao pd;
public List<Pravice> getId(){
List<Pravice> list = new ArrayList<Pravice>();
list = pd.getPravice();
return list;
}
}實體類
實體類可以建立一個，不需要弄成兩個或者多個。public class Sheng {
private int id;
private String name;
private int father;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getFather() {
return father;
}
public void setFather(int father) {
this.father = father;
}
}public class Pravice {
private int id;
private String name ;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}4.效果：
