JAVA-JSP 頁面資料利用 Ajax 傳送至 Controller

How send data to controller by ajax ?
如果在做網頁開發時

我們一定聽過 Ajax 這好用的工具

更是前後端保持暢通的橋樑

但是我們要如何將資料整理後並將資料傳送至 Controller

首先 , 使用的方法有 :

1 . 傳統字串資料傳送

2 . JSON

一 . 傳統字串資料傳送

先在 Jsp 內匯入 JQuery 套件

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

並且在 Ajax 的 data 放置參數
格式為 :

"key1=value1&key2=value2......"

中間分隔用 & 串接

$.ajax({
    type : "post",
    url : "http://localhost:8080/MyProject/query",
    data: "id=1969&name=John", // 資料是用 & 做串接
    success : function(response) {
        alert('Success');
    },
    error : function() {
        alert('fail');
    }
});

最後在 HelloController.java 接收從 Jsp 傳來的參數

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
public class HelloController {

    @RequestMapping(value = "/query") // 對應的連結
    @ResponseBody // 有回應
    public String query(@RequestParam(value="id") Integer id, 
                        @RequestParam(value="name") String name) {
        // 上方欄位說明
        // RequestParam 代表回應的參數
        // value 代表對應的 Key
        // 最後宣告參數型別

        System.out.println("query");
        System.out.println("" + id);  
        System.out.println("" + name);  
        return "searchUser";
    }
    
}

結果如下 :

query
1969
John

參考資料：Spring mvc系列六之 ajax运用(基于json格式)
參考資料：SpringMVC注解@RequestParam全面解析
參考資料：jQuery send string as POST parameters
參考資料：Ajax传值与接收值
歡迎轉載 , 請註明出處 .