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;
        }
    }
}

相关推荐

  1. ASP.NET单与多获取

    2024-07-13 01:04:02       31 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-13 01:04:02       66 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-13 01:04:02       70 阅读
  3. 在Django里面运行非项目文件

    2024-07-13 01:04:02       57 阅读
  4. Python语言-面向对象

    2024-07-13 01:04:02       68 阅读

热门阅读

  1. [C++]多态

    2024-07-13 01:04:02       22 阅读
  2. [Python学习篇] Python Socket网络编程

    2024-07-13 01:04:02       23 阅读
  3. 洛谷 P1506 拯救 oibh 总部

    2024-07-13 01:04:02       22 阅读
  4. 「AIGC」TDSQL技术详解

    2024-07-13 01:04:02       19 阅读
  5. Ultralytics YoloV8库可完成任务介绍

    2024-07-13 01:04:02       25 阅读
  6. Oracle 19c RAC 心跳异常处理

    2024-07-13 01:04:02       19 阅读
  7. 音频demo:将PCM数据和opus格式相互编解码

    2024-07-13 01:04:02       28 阅读
  8. 算术运算符. 二

    2024-07-13 01:04:02       26 阅读
  9. matlab实现pid控制机械系统

    2024-07-13 01:04:02       18 阅读
  10. Http网络通信流程

    2024-07-13 01:04:02       18 阅读