SSM框架前后端信息交互 |
您所在的位置：网站首页 › 前后端json传值 › SSM框架前后端信息交互 |
|
一、从前端向后端传送数据
常见的3种方式 1、form表单的action：此方法可以提交form表单内的输入数据，也可同时提交某些隐藏但设置有默认值的，如修改问题时，我们除了提交问题的相关信息，还需要将用户的编号提交给后端，此时就可以设置一个默认值为用户编号的,并将其隐藏 2、标签的href属性：此方法一般用来提交一些较少的数据，比如对象编号 1 ${question.question_title}比如该处代码，显示了问题的标题信息，并将其作为超链接，点击该链接时进入后端Controller类的方法，并向其发送问题编号question_id 3、ajax请求：此方法一般在不需要页面跳转时采用，可以局部刷新页面，比如向后端提交关注某用户的信息，后端收到ajax的请求数据，对数据库进行操作，并通过@Response注解返回信息给前端，然后前端进行相关操作，可以不进行页面跳转 前端部分代码 1 2 ...... 3 function SaveUserFollowUser(){ 4 var login_user_id = ${login_user_id} //登录者（发起者）编号 5 var user_id = ${user.user_id}; //接受者用户编号 6 7 $.ajax({ 8 url:"/UserRelation/SaveUserFollowUser", 9 type:"POST", 10 async: false, 11 contentType:"application/json;", 12 dataType:'json', 13 14 data:JSON.stringify({"from_user_id":login_user_id,"to_user_id":user_id}), //JSON对象转为字符串 15 success:function(data){ 16 /* 可在后端增加判断发起者和接受者用户是否是同一用户的判断 */ 17 if (data == true) { 18 alert("关注成功"); 19 } else { 20 alert("您已经关注该用户，不可重复关注") 21 } 22 } 23 }); 24 } 25 26 27 ...... 28 关注用户 29 ......后端Controller类 1 /** 2 * 表现层 用户关系相关 (关注用户、被用户关注、关注问题、赞同回答) 3 */ 4 @Controller 5 @RequestMapping("/UserRelation") 6 public class UserRelationController { 7 8 ...... 9 10 /** 11 * 新增某用户关注某用户 12 * @param map 13 * @return 14 */ 15 @RequestMapping(value = "/SaveUserFollowUser",method = {RequestMethod.POST}) 16 public @ResponseBody Boolean SaveUserFollowUser(@RequestBody Map map) { 17 18 //关注发出者编号 19 Integer from_user_id = Integer.parseInt(map.get("from_user_id")); 20 //关注接受者编号 21 Integer to_user_id = Integer.parseInt(map.get("to_user_id")); 22 //是否新增成功 23 //该项可以增加发起者用户和接受者用户是否是同一用户的判断，即比较from_user_id与to_user_id是否相等，如果相等则关注失败 24 //通过返回Integer类型而非Boolean类型的做判断 本程序并未增加这项判断 25 Boolean flag = userRelationService.saveUserFollowUser(from_user_id,to_user_id); 26 return flag; 27 } 28 29 ...... 30 31 } 二、从后端向前端传送数据1、Model 后端部分代码 1 /** 2 * 表现层 用户 3 */ 4 @Controller 5 @RequestMapping(value = "/User") 6 public class UserController { 7 8 ...... 9 10 /** 11 * 进入个人信息页面 12 * @param httpSession 13 * @param model 14 * @return 15 */ 16 @RequestMapping(value = "/DisplayMyInfo") 17 public String DisplayMyInfo(HttpSession httpSession, Model model) { 18 Integer user_id = (Integer) httpSession.getAttribute("login_user_id"); //登录者个人编号 19 User user = userService.findUserById(user_id); //登录者个人信息 20 21 model.addAttribute("user",user); //将登录者个人信息返回给前端 22 return "User/myInfo"; 23 } 24 25 ...... 26 27 }前端部分代码 1 ...... 2 3 用户名:${user.user_name} 4 用户昵称:${user.user_nickname} 5 用户性别:${user.user_sex} 6 用户邮箱:${user.user_email} 7 用户密码:${user.user_password} 8 9 ......此时可以通过${}直接取得后端传来的数据 2、ModelAndView 该方法与Model相比，多增加了返回的视图（View），对于返回给前端的具体数据处理类似 |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |