easyui批量提交数据到Springboot后台

  • Post author:
  • Post category:其他


前台构造JSON数组对象

前台采用easyui框架,使用datagrid的复选框批量提交数据到后台:

<table class="easyui-datagrid" title=" <i class='iconfont'>&#xe989;&#xe989;</i> 羊只信息"
       pagination="true"
       pageSize="20"
       pageList="[20,30,40,50]"
       toolbar="#toolbar"
       data-options="url:baseurl + 'sheepBaseInfo/list',singleSelect:false,rownumbers:true,striped:true,idField:'id',fit:true,onSelect:rowSelected, singleSelect:false,queryParams:qparams,fitColumns:true">
    <thead data-options="frozen:true">
    <tr>
        <th data-options="field:'ck',checkbox:'true'"></th>
        <th data-options="field:'earId',width:'100'">个体编号</th>
    </tr>
    </thead>
    <thead>
    <tr>
        <!-- <th data-options="filed:'oldEarId',width:'100',fixed:true">原有耳号</th>-->
        <th data-options="field:'sex',width:'60',fixed:true">性别</th>
        <th data-options="field:'monthOld',width:'60',fixed:true">月龄</th>
        <th data-options="field:'sheepcotName',width:'120',fixed:true">羊舍</th>
        <th data-options="field:'sheepfoldName',width:'120',fixed:true">羊圈</th>
        <th data-options="field:'varityDataName',width:'120',fixed:true">品种类型</th>
        <th data-options="field:'fatherId',width:'120',fixed:true">父号</th>
        <th data-options="field:'motherId',width:'120',fixed:true">母号</th>
        <th data-options="field:'birthPlace',width:'200',fixed:true">出生地</th>
        <th data-options="field:'birthday',width:'100',fixed:true">出生日期</th>
        <th data-options="field:'entranceDate',width:'100',fixed:true">入场时间</th>
        <th data-options="field:'entranceSource',width:'200',fixed:true">入场来源</th>
        <th data-options="field:'sheepHeight',width:'100',fixed:true">身高(cm)</th>
        <th data-options="field:'sheepWeight',width:'100',fixed:true">体重(kg)</th>
        <th data-options="field:'status',width:'100',fixed:true">羊只状态</th>
    </tr>
    </thead>
</table>

关键代码说明:

<th data-options="field:'ck',checkbox:'true'"></th>      //用于实现复选框效果
singleSelect:false     //防止datagrid的单选与复选冲突

构造JSON数组

 function batchRecSave(){
        //返回选中多行
        var selectRows = $('.easyui-datagrid').datagrid('getSelections');
        var newSheepcotId = $("#newSheepcotId").combobox('getValue');
        var newSheepfoldId = $("#newSheepfoldId").combobox('getValue');
        var circleReason = $("#circleReason").combobox('getValue');
        httpservice.post("flowInfo/batchFlow",
                {
                    arrayList:JSON.stringify(selectRows),//构造JSON数组对象
                    newSheepcotId:newSheepcotId,
                    newSheepfoldId:newSheepfoldId,
                    circleReason:circleReason
                },function (data){
                    if(data){
                        flashMsg("批量转圈成功....");
                        $(".easyui-datagrid").datagrid("reload");
                        $("#editBtn,#deleteBtn").linkbutton("disable");
                    }
                });
    }

此处的 httpservice.post()方法与ajax类似

关键代码说明:

var selectRows = $('.easyui-datagrid').datagrid('getSelections');//用于获取复选的多行内容
arrayList:JSON.stringify(selectRows),  //构造JSON数组对象并以key为arrayList传至后台

后台接收JSON数组对象,并解析

  1. 如果前台额外提交的数据没有对应的实体,后台接收方式如下
    @ResponseBody
    @RequestMapping("/batchFlow")
    public Result batchFlow(String arrayList, Integer newSheepcotId,
                            Integer newSheepfoldId,String circleReason){
        JSONArray jsonArray = JSONArray.fromObject(arrayList);
        List<SheepBaseInfo> list = ( List<SheepBaseInfo>)JSONArray.toCollection(jsonArray,SheepBaseInfo.class);

        for(SheepBaseInfo sheepBaseInfo : list){
           System.out.println(sheepBaseInfo.getEarId());
        }
        result = new Result();
        return result;
    }

2 .如果额外提交的数据有对应的实体,可以直接用实体接收

@ResponseBody
    @RequestMapping("/batchFlow")
    public Result batchFlow(String arrayList, SheepFlowInfo sheepFlowInfo){
        JSONArray jsonArray = JSONArray.fromObject(arrayList);
        List<SheepBaseInfo> list = ( List<SheepBaseInfo>)JSONArray.toCollection(jsonArray,SheepBaseInfo.class);

        for(SheepBaseInfo sheepBaseInfo : list){
           System.out.println(sheepBaseInfo.getEarId());
        }
        result = new Result();
        return result;
    }

SheepBaseInfo即为JSON数组对象中的每一个对象所对应的类

关键代码说明:

JSONArray jsonArray = JSONArray.fromObject(arrayList);  //将JSON字符串转换为JSON数组
List<SheepBaseInfo> list = ( List<SheepBaseInfo>)JSONArray.toCollection(jsonArray,SheepBaseInfo.class); //将json数组转换相关类的List集合



版权声明:本文为summeranhx原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。