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;
        }
    }
}
相关推荐
Mr Xu_2 小时前
Vue 3 中计算属性的最佳实践:提升可读性、可维护性与性能
前端·javascript
lly2024062 小时前
《堆的 shift down》
开发语言
jerrywus2 小时前
我写了个 Claude Code Skill,再也不用手动切图传 COS 了
前端·agent·claude
玖月晴空2 小时前
探索关于Spec 和Skills 的一些实战运用-Kiro篇
前端·aigc·代码规范
子兮曰2 小时前
深入理解滑块验证码:那些你不知道的防破解机制
前端·javascript·canvas
Highcharts.js2 小时前
【Highcharts】如何用命令行渲染导出图片?
javascript·导出·开发文档·highcharts·命令行渲染·命令行功能
黎雁·泠崖2 小时前
【魔法森林冒险】2/14 抽象层设计:Figure/Person类(所有角色的基石)
java·开发语言
会一丢丢蝶泳的咻狗2 小时前
Sass实现,蛇形流动布局
前端·css
攀登的牵牛花3 小时前
前端向架构突围系列 - 状态数据设计 [8 - 4]:有限状态机 (FSM) 在复杂前端逻辑中的应用
前端
Lsx_3 小时前
前端视角下认识 AI Agent 和 LangChain
前端·人工智能·agent