2019.3.21---经验库

//json 简单用法
//js层

layui.use('table', function(){
        var table = layui.table;

        table.render({
            elem: '#test'
            ,url:'<%=basePath%>/userDemo/pFindAll'
            ,toolbar: '#toolbarDemo'
            ,title: '用户数据表'
            ,method:'POST'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'pd_id', title:'ID', fixed: 'left', unresize: true, sort: true, hide:true}
                ,{field:'pd_name', title:'产品名称',edit: 'text'}
                ,{field:'pd_genera', title:'大类', edit: 'text'}
                ,{field:'city', title:'细类'}
                // ,{field:'pd_sellstate', title:'销售状态'}
                ,{field:'pd_putstrte', title:'上架状态'}
                ,{field:'pd_chengben', title:'成本'}
                ,{field:'pd_price', title:'售价'}
                ,{field:'pd_number', title:'库存'}
                ,{field:'pd_biaoqian', title:'标签'}
                ,{field:'pd_pinpai', title:'品牌'}
                // ,{field:'pd_jinkou', title:'进口'}
                ,{field:'pd_soldnum', title:'售出数量'}
                // ,{field:'pd_part', title:'详情'}
                // ,{field:'pd_fabutime', title:'发布时间'}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
            ]]
            ,page: true
        });

        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);

            switch(obj.event){
                case 'shanchu':
                    var data = checkStatus.data;
                    layer.confirm('确定删除选中商品？', function(index){
                        $.ajax({
                            type: "POST",
                            url: '<%=basePath%>userDemo/pDel',
                            data: {p_id:JSON.stringify(data)},
                            dataType: "json",
                            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                            async: false,
                            cache: false,
                            success: function (response) {
                                layer.msg(response.Message);
                                layer.close(index);
                            }
                        });
                    });
                    table.reload("test",{});
                    break;
            };
        });
    });

//json 中 三层数组 第一层数组：{p_id:JSON.stringify(data)，p_id:JSON.stringify(data)} 其中p_id可以定义别的名字 ；第二层：JSON.stringify(data)里的data ，{{p_id：“”}，{pd_name：“”}}；第三层：{pd_id}

 //永久删除选中

    @ResponseBody
    @RequestMapping(value = "/pDel" , produces = "",method = RequestMethod.POST)
    public String pDel(){
        PageData pd = this.getPageData();
        
        //json数组    p_id 是第一层数组中 ， p_id所对应的值
        List<JSONObject> jsonarray = JSONArray.fromObject(**pd.getString("p_id"**));
        List<PageData> list = new ArrayList<PageData>();

        for(int i=0;i<jsonarray.size();i++){
            PageData p = new PageData();
            //i是第二层的下标，   p_id是第三层名字所对应的值
            p.put("p_id",jsonarray.get**(i)**.getString(**"p_id"**));
            list.add(p);
        }
        String Message = "";
        try {
            userService.pDelete(list);
            Message = "删除成功";
        } catch (Exception e) {
            Message = "删除失败";
            e.printStackTrace();
        }
        return R.doOut("",Message,"");
    }

//layui中----------------------------------------------------------------------------------------------------------

<div class="layui-body">
        <!-- 内容主体区域 -->
        <table class="layui-hide" id="test" lay-filter="test"></table>
        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm" lay-event="shanchu">删除选中</button>
                <button class="layui-btn layui-btn-sm" lay-event="fabu">发布产品</button>
                <button class="layui-btn layui-btn-sm" lay-event="shangjia">批量上架</button>
            </div>
        </script>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="low">下架</a>
        </script>
    </div>

obj.data; 获取的是这一行中的数据 不会获得其中属性，
如果想获得其中的属性值：obj.event

table.on('tool(test)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'low'){
                layer.confirm('真的删除行么', function(index){

                });
            } else if(obj.event === 'edit'){
                layui.layer.open({
                    type: 2,
                    anim: 1,
                    area: ['50%', '65%'], //宽高
                    content: '<%=basePath%>userDemo/goEdit?id='+data.id
                });
            }
        });