ajax向SpringMVC Controller传参,并且Controller返回map的方法。

ajax向SpringMVC Controller传参,并且Controller返回map的方法。

最近写项目的时候用到了SpringMVC框架,在页面中ajax和Controller互相传值的过程中,遇到了很多问题,在此记录一下。
前端jsp。

注意:我这种方法不管是ajax向Contorller传值,还是Controller像ajax传值,传递的实际上都是json对象,而非json字符串,所以变量名不用加双引号

代码:

   function uploadElectricFenceInfo() {
   
        var electricFenceName = $("#fence_name_input").val();
       var centerLon = $("#center_lon_input").val();
       var centerLat = $("#center_lat_input").val();
       var radius = $("#radius_input").val();
       var userName = "小明";
       var paramList={
           ElectronicFenceName:electricFenceName,
           centerLong:centerLon,
           centerLat:centerLat,
           radius:radius,
           username:userName
       };


       //alert(electricFenceName+"\n"+centerLon+"\n"+centerLat+"\n"+userName);

       jQuery.ajax({
           async:true,//异步加载
           timeout:1000,
           data:paramList,
           type:"POST",
           //contentType:"application/json",这句不能加,加了后台会接收不到值。
  • 4
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
首先,需要在后端Controller中将User集合放入model中,给前端jsp页面。 Controller代码示例: ```java @RequestMapping("/userList") public String showUserList(Model model) { List<User> userList = userService.getUserList(); model.addAttribute("userList", userList); return "userList"; } ``` 在jsp页面中,可以使用JSTL标签库来进行遍历展示User信息,同时添加全选删除按钮。 JSP页面代码示例: ```jsp <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <table> <tr> <th><input type="checkbox" id="selectAll"></th> <th>用户名</th> <th>密码</th> </tr> <c:forEach items="${userList}" var="user"> <tr> <td><input type="checkbox" name="userId" value="${user.id}"></td> <td>${user.userName}</td> <td>${user.password}</td> </tr> </c:forEach> </table> <button id="deleteSelected">删除选中</button> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(function () { // 全选/取消全选 $("#selectAll").click(function () { $("input[name='userId']").prop("checked", $(this).prop("checked")); }); // 删除选中 $("#deleteSelected").click(function () { var userIds = []; $("input[name='userId']:checked").each(function () { userIds.push($(this).val()); }); if (userIds.length === 0) { alert("请选择要删除的用户!"); return; } $.ajax({ url: "/deleteUsers", data: {userIds: userIds}, traditional: true, success: function (data) { if (data.success) { alert("删除成功!"); location.reload(); } else { alert("删除失败!"); } } }); }); }); </script> ``` 其中,全选/取消全选和删除选中按钮使用了jQuery实现。当点击删除选中按钮时,会向后端发送一个ajax请求,删除选中的用户,并返回删除成功或删除失败的信息。 后端Controller处理删除请求代码示例: ```java @RequestMapping("/deleteUsers") @ResponseBody public Map<String, Object> deleteUsers(@RequestParam("userIds") List<Integer> userIds) { Map<String, Object> resultMap = new HashMap<>(); boolean success = userService.deleteUsers(userIds); resultMap.put("success", success); return resultMap; } ``` 在UserService中,需要实现根据id批量删除用户的方法。 UserService删除用户代码示例: ```java @Transactional public boolean deleteUsers(List<Integer> userIds) { return userDao.deleteByIds(userIds) > 0; } ``` 其中,userDao是User表的DAO层接口,deleteByIds方法是根据id批量删除用户的方法。需要注意的是,为了保证事务的一致性,删除用户的操作应该在一个事务中执行,因此在UserService中使用@Transactional注解开启事务管理。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值