fixedColumns plugin

fixedColumns plugin

wiolwiol Posts: 5Questions: 1Answers: 0

I have problem with dataTables.fixedColumns.min.js plugin , don't work, First column is not fixed.
This is error
TypeError: a[h][l] is undefined

My HTML
<div class="box"> <div class="box-header"> <h3 class="box-title">Raport</h3> </div> <div class="box-body"> <div class="table-responsive"> <table id="unknown_driver_table" class="table table-bordered table-striped" width="100%"> <thead> <tr> <tr> <th>Login</th> <th>Name</th> <th>Surname</th> <th>Incom IBN</th> <th>Cash IBN</th> <th>Pay IBN</th> <th>Incom WRM</th> <th>Cash WRM</th> <th>Pay WRM</th> <th>Incom CDY</th> <th>Cash CDY</th> <th>Pay CDY</th> <th>Incom AHN</th> <th>Cash AHN</th> <th>Pay AHN</th> <th>Pay FTR</th> <th>Cash</th> <th>Minus</th> <th>Desc</th> <th>Attach</th> <th>Wypłata</th> <th>City</th> <th>Agr</th> <th>Data start</th> <th>Data end</th> </tr> </tr> </thead> </table> </div> </div> </div> <!-- /.box-body -->

Java Script
$(document).ready( function () { var tabela_unknown = $('#unknown_person_table').DataTable({ scrollY: "500px", scrollX: true, scrollCollapse: true, paging: false, fixedColumns: true, "searching": true, "sAjaxSource": "/upload/adm/getcurrentcalc", "sAjaxDataProp": "", "order": [[ 0, "asc" ]], "aoColumns": [ { "mData": "id_opus"}, { "mData": "name_drv" }, { "mData": "surname_drv" }, { "mData": "ubra_income" }, { "mData": "ubra_cash" }, { "mData": "bert_income" }, { "mData": "bert_cash" }, { "mData": "eaasd_income" }, { "mData": "kubra_income" }, { "mData": "kussd_income" }, { "mData": "mrtw_cash" }, { "mData": "vat_sum" }, { "mData": "c_fee" }, { "mData": "invoice_vat" }, { "mData": "calc_invoice" }, { "mData": "agreement_fee" }, { "mData": "cash_fee" }, { "mData": "minus" }, { "mData": "minus_description" }, { "mData": "sum_calculation" }, { "mData": "payment_sum"}, { "mData": "city"}, { "mData": "agree" }, { "mData": "start_d" }, { "mData": "end_d" } ], "language": { "sUrl": '/bower_components/datatables.net/pl.json' } }); });

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/fixedcolumns/3.2.6/js/dataTables.fixedColumns.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/fixedcolumns/3.2.6/css/fixedColumns.bootstrap.min.css">

I noticed than when I use sAjaxSource don't work but when i use defined table with defined data this work. Example of defined table:
<thead>
<tr>
<th>First name</th>
<th>Last name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
<th>Extn.</th>
<th>E-mail</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
<td>Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
<td>5421</td>
<td>t.nixon@datatables.net</td>
</tr>
</body>

Answers

Sign In or Register to comment.