layui table表单 checkbox选中一个其它也要选中

Acitylion

于 2024-08-21 19:39:31 发布

阅读量165

点赞数 1

分类专栏： layui get 技能文章标签： layui 前端 javascript

本文链接：https://blog.csdn.net/Acitylion/article/details/141401342

版权

get 技能同时被 2 个专栏收录

102 篇文章 2 订阅

订阅专栏

layui

14 篇文章 2 订阅

订阅专栏

当我们选中其中一个商品的时候同类型的商品状态也要跟着改变

所以要在表单加载完成后去监听checkbox

 ,done:function (res) {
              console.log('详情表格数据',res)
              tableDetailList = res.data;
              // 监听表格复选框选择
              table.on('checkbox(' + INST_SELECTORS.instLayFilters.unpaidTableDetailFilter + ')', function(obj){
                console.log('复选框',obj)
                var checked = obj.checked; // 获取当前复选框的选中状态
                var groupId = obj.data.groupId;//选中的组合id
                if(checked){ //如果是选中状态
                  tableDetailList.map(function (item,index) {
                    console.log('进来了吧')
                    if(item.groupId == groupId){ //判断是否是同一个组合
                      tableDetailList[index].LAY_CHECKED = true;
                      var checkbox =  $(INST_SELECTORS.instIdSelectors.unpaidTableDetailId).next().find('.layui-table-body tr[data-index=' + index + '] input[type="checkbox"]');
                      var $dx =$(checkbox) // 要重新赋值 修改dom元素
                      $dx.prop('checked', true);
                      $dx.next().addClass('layui-form-checked');
                    //  下面这种方式只是样式上有所改变 DOM元素没有放生变化
                    //  $(INST_SELECTORS.instIdSelectors.unpaidTableDetailId).next().find('.layui-table-body tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
                    //  $(INST_SELECTORS.instIdSelectors.unpaidTableDetailId).next().find('.layui-table-body tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
                    }
                  })
                  // 刷新checkbox的渲染
                  form.render();

                }else { //如果是取消状态
                  tableDetailList.map(function (item,index) {
                    console.log('进来了吧')
                    if(item.groupId == groupId){
                      tableDetailList[index].LAY_CHECKED = false;
                      var checkbox =  $(INST_SELECTORS.instIdSelectors.unpaidTableDetailId).next().find('.layui-table-body tr[data-index=' + index + '] input[type="checkbox"]');
                      var $dx =$(checkbox)
                      $dx.prop('checked', false);
                      $dx.next().removeClass('layui-form-checked');
                    }
                  })
                  // 刷新checkbox的渲染
                  form.render();

                }
              });

            }