js前端隐藏列 并且获取值,列表复选框

列表框

复制代码
            <div class="block" id="psi_wh_allocation_m">
                        <table id="result" class="list auto hover fixed" style="width:100%;border-collapse:collapse">
                            <thead>
                            <tr>
                                <%--<th></th>--%>
                                <%--<th><h:checkbox indexed="true" property="SELECTALL" onclick="selectAll(this)" /></th>--%>
                                <th><input type="checkbox" id="selectAllCheckbox" onclick="selectAll(this)"></th>
                                <th><b:message key="KA0020.G02015.MODEL.SECTION" /></th>
                                <th><b:message key="KA0020.G02015.MODEL.BP_GROUP" /></th>
                                <th><b:message key="KA0020.G02015.MODEL.PRODUCT_GROUP" /></th>
                                <th><b:message key="KA0020.G02015.MODEL.PRODUCT_CATEGORY" /></th>
                                <th><b:message key="KA0020.G02015.MODEL.AMS_MODEL" /></th>
                            </tr>
                            </thead>
                            <l:iterate id="PSI_WH_ALLOCATION_M" property="PSI_WH_ALLOCATION_M" indexId="index">
                                <h:tbody>
                                    <tr>
                                        <%--<td><h:checkbox name="selectItem" indexed="true" property="FLAG" /></td>--%>
                                        <td><input name="selectItem" property="FLAG" type="checkbox" class="rowCheckbox"></td>
                                        <td><b:write name="PSI_WH_ALLOCATION_M" property="SECTION" /></td>
                                        <td><b:write name="PSI_WH_ALLOCATION_M" property="BP_GROUP" /></td>
                                        <td><b:write name="PSI_WH_ALLOCATION_M" property="product_group" /></td>
                                        <td><b:write name="PSI_WH_ALLOCATION_M" property="product_category" /></td>
                                        <td><b:write name="PSI_WH_ALLOCATION_M" property="ams_model" /></td>
                                      <%--隐藏列--%>
                                        <td style="width:0px;display: none;">
                                            <h:hidden name="PSI_WH_ALLOCATION_M" indexed="true" property="inventory_item_id" />
                                            <%--<b:write name="PSI_WH_ALLOCATION_M" property="inventory_item_id" />--%>
                                        </td>
                                    </tr>
                                </h:tbody>
                            </l:iterate>
                        </table>
                    </div>
                    <div class="mdui-col">
                        <m:right>
                              <button type="button"
                                  class="face-form-button btnStyle mdui-color-blue-a700"
                                      onclick="savePsi_wh_allocation_m()">
                                     <b:message key="KA0020.G02015.MODEL.ADD" />
                             </button>

                            <button type="button"
                                    class="face-form-button btnStyle mdui-color-blue-a700"
                                    onclick="del(frmMain)">
                                <b:message key="KA0020.G02015.MODEL.DELETE" />
                            </button>
                        </m:right>
                    </div>

获取隐藏值js代码

复制代码
function del(frmMain) {
    debugger
    //获取所有tr的数据
    var table = $("#psi_wh_allocation_m").find("tbody");

    var myck= document.getElementsByName("selectItem");
    var num =  $("#psi_wh_allocation_m").find("tbody").length;
    var array = [];
    for (var a=0;a<num;a++){
        if (myck[a].checked){
            var tr = table[a].rows[0].cells;
            // 遍历当前 tr 内的所有 td 元素
            let row = {};
            row['section'] = tr[1].textContent;
            row['bp_group'] = tr[2].textContent;
            row['product_group'] = tr[3].textContent;
            row['product_category'] = tr[4].textContent;
            debugger  /*删除有问题 取型号id*/
            // row['inventory_item_id'] = tr[5].textContent;
            //获取隐藏列的值
            row['inventory_item_id'] = tr[6].querySelector('input').value;
            array.push(row);
        }
    }
    f.doAjaxResult('allocation.G02015@del', {
        data: JSON.stringify(array),
    }, function (res) {
        if (res.success) {
            f.doPost(frmMain, 'allocation.G02015@init', true);
        }else{
            res.message && alert(res.message);
        }
    });
}


其实项目中的 h:hidden 标签
等同于 input 标签

复选框js代码

复制代码
function selectAll(checkbox) {
    debugger
    if (checkbox.checked == true) {//选中,则将下面表格中信息全部选中存入临时表中
        var tableRows = document.getElementById("result").rows.length - 1; // 获取表格的行数
        for (var i = 0; i < tableRows; i++) {
            debugger
            if(!document.getElementsByName('selectItem')[i].checked){//判断表格中checked是否已被选中,若没有被选中在将数据加入临时表(已经选中的信息不会再加入临时表)
                document.getElementsByName('selectItem')[i].checked=true;//将选中的checkbox勾选上
            }
        }
    } else {//取消选中,则将下面表格中的全部信息从临时表中删除
        var tableRows = document.getElementById("result").rows.length - 1; // 获取表格的行数
        for (var i = 0; i < tableRows; i++) {
            document.getElementsByName('selectItem')[i].checked=false;
        }
    }
}
相关推荐
Bs_MoneyMagnet7 分钟前
基于springboot+vue的宠物殡葬管理平台的设计与实现 源码+文档
java·javascript·vue.js·spring boot·后端·宠物
凌风的跨境分享12 分钟前
Temu店群运维提效:定时策略自动化任务全场景实操指南
大数据·运维·前端·人工智能·架构·自动化
我是唐青枫28 分钟前
C#.NET PInvoke 深入解析:封送、内存布局与原生互操作实战
开发语言·c#·.net
linux_cfan34 分钟前
videojs v10 源代码系列解读:06 · DOM 工具箱:事件、聚焦、Shadow DOM、定位
前端
程序猿编码37 分钟前
纯C++轻量计算机视觉推理引擎:基于GGML的端侧CV模型部署技术全解析
开发语言·c++·计算机视觉·大模型·transformer
尾善爱看海42 分钟前
Vue 面试进阶篇:Composition API、插槽、自定义指令……8 个章节 + 高频面试题全解析
前端·javascript·vue.js·面试·vue
SEO_juper1 小时前
外贸多语言站最隐蔽的流量杀手:hreflang 错了,谷歌把德语页推给美国人(附审计脚本)
开发语言·前端·python·seo·独立站·谷歌优化
亿元程序员1 小时前
为什么现在 AI 这么发达了,还要坚持手搓教程?
前端
geovindu1 小时前
CSharp: Strategy Pattern
开发语言·后端·c#·.net·.netcore·策略模式·行为模式
Tairitsu_H2 小时前
[C++] C++11新增构造:列表初始化和std::initializer_list
开发语言·c++·c++11·构造