Spring Mvc模式下Jquery Ajax 與后台交互操作

1.基本代碼

1)后台控制器基本代碼

@Controller
@RequestMapping("/user")
public class UserController {

    @Autowired
    private UserService userService;//服務

    @ResponseBody
    @RequestMapping(value="/getUser/*訪問路徑自己設置*/", method = RequestMethod.POST)
     public Object getUser(@RequestBody User user){

     User resUser = new User();
     resUser  = userService.getUsers(user.getUserId());//根據userId查詢用戶

     return resUser;
    }

}

 

 

 

2）User類代碼

 

public class User {
    private String userName;
    private String userId;
    private String userPassword;

    public String getUserName() {
        return userName;
    }
    public void setUserName(String userName) {
        this.userName = userName;
    }
    public String getUserId() {
        return userId;
    }
    public void setUserId(String userId) {
        this.userId = userId;
    }
    public String getUserPassword() {
        return userPassword;
    }
    public void setUserPassword(String userPassword) {
        this.userPassword = userPassword;
    }
}

 

 

 

3）前台js中Jquery Ajax使用代碼

      

  var params = {
               userId : "12"//userId 應與User類中屬性名一致 12為傳回去的查詢值，可以通過輸入框獲取值傳入
            };
        $.ajax({
            type : "post",
            url : getRootPath() + "/user/getUser",//訪問路徑
            dataType : "json",
            contentType : "application/json",
            data : JSON.stringify(params),
            timeout : commonTimeOut,
            error : queryUsersError,
            global : false,
            success : queryUsersSuccess,//查詢成功處理函數
        });

//查詢成功處理函數

function queryUsersSuccess(result) {
        // 處理返回的數據result

       //通過處理result返回的結果集顯示到頁面
  }

 

 

 

 

2.交互流程

前台將需要查詢的條件通過Ajax返回后台，后台查詢過后將結果賦給User對象，對於返回的結果前台就可以自由操作了。