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;
        }
    }
}
相关推荐
JYeontu几秒前
开箱流水加载动画
前端·javascript·css
沪飘大军1 分钟前
goldRush-专门分析黄金的投资理财agent
java·开发语言·elasticsearch
RANxy1 分钟前
AntV 入门系列:G6 图可视化实战
前端
尽欢i3 分钟前
Vue3 customRef 封神教程:防抖、本地存储、自动埋点一套搞定,模板干干净净
前端·javascript·vue.js
VOLUN6 分钟前
TypeScript封装通用RESTful BaseAPI,后台接口代码精简80%
前端·javascript
胡永双6 分钟前
Hexo + GitHub Pages搭建个人Blog教程(三)
前端
hunterandroid9 分钟前
[Android 从零到一] 权限管理:运行时权限与最佳实践
前端
kyrie2811 分钟前
Redux 完整基础操作(原生 Redux,不结合 React-Redux)
前端
因_崔斯汀12 分钟前
Vue 模板编译:HTML 是怎么变成 JS 的?
前端·vue.js