Question

我正在尝试在datatable中实现多个选择复选框。但是当我提交表单时，我收到了此错误

TypeError：table.column不是函数[了解更多]

我使用以下代码：

pageSetUp();
var pagefunction = function() {
    var table = $('#pendingInvoice').dataTable({            
"sDom": "<'dt-toolbar'<'col-xs-12 col-sm-6'f>
           <'col-sm-6 col-xs-6 hidden-xs'T>r>"+"t"+
                "<'dt-toolbar-footer'<'col-sm-6 col-xs-12 
              hidden-xs'i><'col-sm-6 col-xs-12'p>>",
        "oLanguage": {
            "sSearch": '<span class="input-group-addon">
             <i class="glyphicon glyphicon-search"></i></span>'
        },          
        "oTableTools": {
             "aButtons": [
             "copy",
             "xls",
                {
                    "sExtends": "pdf",
                    "sTitle": "Techmj_PDF",
                    "sPdfMessage": "Techmj PDF Export",
                    "sPdfSize": "A4"
                },
                {
                    "sExtends": "print",
                    "sMessage": "Generated <i>(press Esc to close)</i>"
                }
             ],
            "sSwfPath": "js/plugin/datatables/swf/copy_csv_xls_pdf.swf"
        },

        "columnDefs": [
                 {
                    'targets': 0,
                    'checkboxes': {
                       'selectRow': true
                    }
                 }
        ],
        order: [[ 0, 'desc' ]],
        'select': {
             'style': 'multi'
          }      
    });
    $('#frm-example').on('submit', function(e){
        e.preventDefault();
        var rows_selected = table.column(0).checkboxes.selected();
        $.each(rows_selected, function(index, rowId){
            $(form).append($('<input>')
                 .attr('type', 'hidden')
                 .attr('name', 'id[]')
                 .val(rowId));
        });
    });
  };
  loadScript("js/plugin/datatables/jquery.dataTables.min.js", function(){
    loadScript("js/plugin/datatables/dataTables.colVis.min.js", function(){
        loadScript("js/plugin/datatables/dataTables.tableTools.min.js", function(){
            loadScript("js/plugin/datatables/dataTables.bootstrap.min.js", function(){
                loadScript("js/plugin/datatables/dataTables.checkboxes.min.js", function(){
                loadScript("js/plugin/datatable-responsive/datatables.responsive.min.js", pagefunction);
                });
            });
        });
    });
});

这是我的html表：

 <form id="frm-example" action="model/unapprove.php" method="POST">             
 <table id="pendingInvoice" class="table table-striped table-bordered table-hover" width="100%">
    <thead>
        <tr>
            <th data-hide="phone">ID</th>
            <th data-class="expand">Customer Name</th>
            <th data-hide="phone,tablet">Group Name</th>
            <th data-hide="phone,tablet">Pay Amount</th>                            
            <th data-hide="phone,tablet">Pay Date</th>
            <th data-hide="phone,tablet">Action</th>
        </tr>
        </thead>
        <tbody>
        <?php while($row = $app->fetch(PDO::FETCH_OBJ)): ?>
            <tr>
              <td><?php echo $row->id; ?></td>
              <td><?php echo $row->hming; ?></td>
              <td><?php echo $row->groupname; ?></td>
              <td><?php echo $row->payamount; ?></td>
              <td><?php echo $row->paydate; ?></td>
              <td><?php if($row->status=='Approved'){
                echo '<a href="ajax/forms/approvepayment.php?id='.$row->id.'" data-toggle="modal" data-target="#approvePending"class="label label-success">Approved</a>'; 
                }else if($row->status=='Pending'){
                echo '<a href="ajax/forms/approvepayment.php?id='.$row->id.'" data-toggle="modal" data-target="#approvePending" class="label label-warning">Pending</a>';
                }else{
                echo '<a href="ajax/forms/approvepayment.php?id='.$row->id.'" data-toggle="modal" data-target="#approvePending" class="label label-danger">Rejected</a>';
                } ?></td>
                </tr>
                <?php endwhile; ?>
            </tbody>                            
        </table>
        <p><button type="submit" class="btn btn-success">Approve</button></p>
        </form>

代码哪里出错了？当我点击提交按钮时，它无法获取表变量。我无法弄清楚代码出错的地方。请帮忙。

Answer 1

使用DataTable()代替dataTable()初始化您的表格。例如：

var table = $('#pendingInvoice').DataTable({
   // ... skipped ...
});

有关更多示例和详细信息，请参阅jQuery DataTables Checkboxes。

无法在datatable中提交选定的值

1 个答案: