zoukankan      html  css  js  c++  java
  • datatables如何把列设置成hidden隐藏域?

    官网:https://datatables.net/reference/option/
    设置: visible: false
    如下:


    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">

    <script src="../../js/jquery-1.9.1.min.js"></script>
    <script src="../../js/layer/layer.js"></script>
    <script src="../../js/public.js"></script>

    <script src="../../js/datatables/jquery.dataTables.min.js"></script>

    </head>


    <body>

    <div align="center" style=" 99%;">
    <table id="dataGrid" align="center" border="1" style=" 100%;">
    <thead>
    <tr>
    <th style="display: none">patrolRecordId</th>
    <th align="center" class="table_title">巡视班组</th>
    <th align="center" class="table_title">巡视人</th>
    <th align="center" class="table_title">巡视开始时间</th>
    <th align="center" class="table_title">巡视结束时间</th>
    <th align="center" class="table_title">图片</th>
    </tr>
    </thead>
    <tbody>
    </tbody>
    </table>
    </div>

    <div align="right">
    <button style="80px;background-color: #9CE6F2" onclick="window.history.back()" >关闭</button>
    </div>

    </body>

    <script type="application/javascript">

    document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {
    console.log("页面初始化");
    if(mam.navigator){
    initData();
    }else {
    $(function() {
    initData();
    });
    }
    }

    function initData() {
    var recordParams = {};
    var queryKey = "";
    var queryType = getQueryVariable("queryType");
    if(queryType == "byFeedbackId"){
    queryKey = "PATROL_RECORD";
    var feedbackId = getQueryVariable("feedbackId");
    recordParams.feedbackId = feedbackId;
    }else if(queryType == "byFormId"){
    queryKey = "PATROL_RECORD_LIST";
    var warningFormId = getQueryVariable("warningFormId");
    var operationKey = getQueryVariable("operationKey");
    recordParams.warningFormId = warningFormId;
    recordParams.operationKey = operationKey;
    }


    var data = [];
    exAjax("postJSON",queryKey,recordParams,"WARN_DATA",function(e){
    if(notEmptyStr(e.recordList) && e.recordList.length > 0){
    data = e.recordList;
    // console.dir(data);

    var table = $('#dataGrid').DataTable({
    "scrollY" : $(document).height()*0.65,
    "scrollCollapse" : true,//滚动
    "paging" : false,
    "searching" : false,//去除搜索栏
    "language" : {
    "info" : "",
    // "zeroRecords" : "没有找到记录",
    "zeroRecords" : " ",
    "infoEmpty" : "没有查询到相关数据!"
    },
    "ordering": false,
    "drawCallback" : function(){
    // this.api().column("photo:name").nodes().each(function(cell, i) {
    // cell.innerHTML = "<a onclick='patrolDocList(patrolRecordId)'>图片</a>"
    // });

    var dataTable = this.api();

    this.api().rows().nodes().each(function(cell, i) {
    var patrolRecordId = dataTable.cell(i,0).data();
    cell.cells[4].innerHTML = "<a onclick="patrolDocList('"+patrolRecordId+"')">图片</a>";//图片栏
    });

    },

    data: data,
    columns: [
    {
    data: 'patrol_record_id',
    visible: false
    },
    {
    data: 'org_name',
    "20%"
    },
    {
    data: 'patrol_user_name',
    "16%"
    },
    {
    data: 'patrol_start_time',
    "28%"
    },
    {
    data: 'patrol_end_time',
    "28%"
    },
    {
    data: {},
    name: 'photo'
    }//图片
    ]
    });
    }

    });
    }


    function patrolDocList(patrolRecordId) {
    console.dir(patrolRecordId);
    }



    </script>
    </html>
  • 相关阅读:
    进程实际操作篇2
    进程的实际操作篇1
    进程的理论知识
    解决套接字粘包,udp套接字对象的使用和socketserver模块实现并发
    day24-网络知识扫盲,socket的基本使用
    day23-网络编程之互联网基础,tcp/ip协议详细介绍
    day21-多态和多态性,鸭子类型,反射,内置方法,异常处理
    JAVA WEB小测
    JAVA动手动脑
    JAVA课上动手动脑问题2
  • 原文地址:https://www.cnblogs.com/YuyuanNo1/p/9481652.html
Copyright © 2011-2022 走看看