1. 程式人生 > >使用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:
這樣拿到id的集合,那後面的操作就方便了。