视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
ajax怎样传递数组到后台
2020-11-27 19:57:17 责编:小采
文档
 这次给大家带来ajax怎样传递数组到后台,ajax传递数组到后台的注意事项有哪些,下面就是实战案例,一起来看一下。

前言

我们在使用ajax异步的提交多选框得到需要操作的对象的id,这时我们可以把每一个id做出一个对象,之后放到一个数组中,再使用JSON.stringify()对这个数组进行json的格式化;在后台中再inputStream中解析出我们的json字符串,之后只用:

new JSONArray()得到json数组,循环解析我们想要的属性:

var countsCheckBox = $("input[type='checkbox']:checked"); 
 var booksid = []; 
 for(var i=0;i<countsCheckBox.length;i++){ 
 //使用[]取得元素是是一个domElement元素,取值需要使用.value, 
 //如果使用countsCheckBox.eq(i) 则是一个Obkject元素,就可以使用val()取值 
 //alert(countsCheckBox[i].value); 
 mysendbook_id = {}; 
 mysendbook_id['book_id'] = countsCheckBox[i].value; 
 booksid[i] = mysendbook_id; 
 } 
 //alert(booksid); 
 var confirmdel= confirm('确认要删除吗?'); 
 if(confirmdel){ 
 //开始请求删除 
 $.ajax({ 
 url:'selectdelbooks', 
 data:JSON.stringify(booksid), 
 type:'post', 
 success:function(res){ 
 alert("删除成功"); 
 location.replace("/TheDemo/books/pageBooksShow"); 
 } 
 }); 
 }

上面的js中我们把每一个选中的id放到一个mysendbook_id的“book_id”的属性中,再把这个对象放到booksid的数组中;到发送异步请求时使用

JSON.stringify(bookid)格式化这个booksid数组,得到一个json的数组。

再看后台我们怎么接收:

一个是做一个类里面有一个list,这个list装的是只有一个属性为bookid的类,再使用注解@RequestBody加到这个形参上。但是这样比较麻烦;

还有一种是从输入流里面获取数据,使用IOUtils.toString 把inputStream转为字符串,再使用new JSONArray(mybooksid);得到这个json数组

从而得到每一个json中的book_id的属性值

<span style="font-family:SimSun;font-size: 10.5pt;"> </span><span style="font-family:KaiTi_GB2312;font-size:14px;"> @RequestMapping("selectdelbooks") 
 public String selectdelbooks(HttpServletRequest request) throws Exception { 
 ServletInputStream inputStream = request.getInputStream(); 
 String mybooksid = IOUtils.toString(inputStream); 
 JSONArray jsonarr = new JSONArray(mybooksid); 
 List<String> book_id =new ArrayList<String>(); 
 for (int i=0;i<jsonarr.length();i++){ 
 book_id.add(((JSONObject)jsonarr.get(i)).getString("book_id")); 
 }...</span>

这样我们得到一个list,里面有我们选中的id值。

数据库中信息:

页面的多选:

后台得到的选择的book的id:

相信看了本文案例你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!

推荐阅读:

如何实现AJAX的分页效果

怎样用Ajax提交表单并接收其中的json数据

实现列表无限加载与二级下拉菜单选项的Ajax(附代码)

下载本文
显示全文
专题