So I get a console error on a large set of rows that I'm iterating from a database with php. I am initializing this with the metronic theme. As you can see I have my thead and tbody.
因此,我在使用php迭代数据库的一大堆行中得到了一个控制台错误。我正在用节拍器主题初始化它。正如你看到的,我有我的thead和tbody。
I suspect the issue could pertain to the size of the output and maybe needing to use another method, any guidance appreciated
我怀疑这个问题可能与输出的大小有关,可能需要使用另一种方法,任何指导都值得赞赏
<table id="sample_1" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th class="table-checkbox">
<input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes"/>
</th>
<th>Name</th>
<th>Source</th>
<th>Email</th>
<th>Customer</th>
<th>Created</th>
<th>Login</th>
<th>Active</th>
<th>Role</th>
<th>Incentive</th>
<th>View</th>
<th>Switch</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<?php
$users=user::get_all($filter);
if($users){
foreach($users as $row){
$customer=user::get_cutomer_name_by_source_id($row['source_id']);
?>
<tr class='odd gradeX'>
<td><input type='checkbox' class='checkboxes' value='1'/></td>
<td><?php echo $row['first_name']." ".$row['last_name']; ?></td>
<td><?php echo $row['source_id']; ?></td>
<td><?php echo $row['email']; ?></td>
<td><?php echo $customer; ?></td>
<td><?php echo date("m/d/Y", strtotime($row["created"])); ?></td>
<td><?php if($row['login']!=NULL){echo date("m/d/Y",$row['login']);} ?></td>
<td><?php if($row['active']==1){echo "Yes";}else{echo "No";} ?></td>
<td><?php echo user::get_role_name($row['rid']); ?></td>
<td><?php
if($row['cash_incentive']==1){echo "Cash";}else{echo "Regular";} ?>
</td>
<td><a href='user-edit?uid="<?php echo $row['uid']; ?>"'>View </a></td>
<td><a href='switch?email="<?php echo $row['email']; ?>"'> Switch</a></td>
<td><input type='checkbox' name='email-list[]' value='<?php echo $row['email']; ?>'></td>
</tr>
<?php }
}
?>
</tbody>
And here is the metronic init for the datatable:
这是datatable的节拍器init:
table.dataTable({
// Internationalisation. For more info refer to http://datatables.net/manual/i18n
"language": {
"aria": {
"sortAscending": ": activate to sort column ascending",
"sortDescending": ": activate to sort column descending"
},
"emptyTable": "No data available in table",
"info": "Showing1 _START_ to _END_ of _TOTAL_ entries1",
"infoEmpty": "No entries found",
"infoFiltered": "(filtered1 from _MAX_ total entries)",
"lengthMenu": "Show _MENU_ entries",
"search": "Search:",
"zeroRecords": "No matching records found"
},
// Or you can use remote translation file
//"language": {
// url: '//cdn.datatables.net/plug-ins/3cfcc339e89/i18n/Portuguese.json'
//},
// Uncomment below line("dom" parameter) to fix the dropdown overflow issue in the datatable cells. The default datatable layout
// setup uses scrollable div(table-scrollable) with overflow:auto to enable vertical scroll(see: assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js).
// So when dropdowns used the scrollable div should be removed.
//"dom": "<'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r>t<'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",
"bStateSave": true, // save datatable state(pagination, sort, etc) in cookie.
"columns": [{
"orderable": false
}, {
"orderable": true
}, {
"orderable": false
}, {
"orderable": false
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": true
}, {
"orderable": false
}],
"lengthMenu": [
[5, 15, 20, -1],
[5, 15, 20, "All"] // change per page values here
],
// set the initial value
"pageLength": 5,
"pagingType": "bootstrap_full_number",
"language": {
"search": "My search: ",
"lengthMenu": " _MENU_ records",
"paginate": {
"previous":"Prev",
"next": "Next",
"last": "Last",
"first": "First"
}
},
"columnDefs": [{ // set default column settings
'orderable': false,
'targets': [0]
}, {
"searchable": false,
"targets": [0]
}],
"order": [
[1, "asc"]
] // set first column as a default sort by asc
});
1 个解决方案
#1
7
CAUSE
Number of items in array specified by columns
option should match number of <td>
elements. You have 12 elements in columns
array and 13 <td>
elements.
列选项指定的数组中项的数量应该与元素的数量匹配。在列数组中有12个元素,13个元素。
From the manual:
从手册:
Note that if you use
columns
to define your columns, you must have an entry in the array for every single column that you have in your table (these can benull
if you don't which to specify any options).注意,如果使用列来定义列,则必须在数组中为表中每个列指定一个条目(如果不指定任何选项,这些条目可以为null)。
SOLUTION
Add extra object to columns
array to match number of columns in the HTML.
向列数组添加额外的对象,以匹配HTML中的列数。
Alternatively you can replace columns
with columnDefs
entirely for readability.
或者,您可以完全用columnDefs替换列,以提高可读性。
"columnDefs": [{
"orderable": false,
"searchable": false,
"targets": [0]
}, {
"orderable": false,
"targets": [2, 3, 11, 12]
}
],
LINKS
See jQuery DataTables: Common JavaScript console errors for more information on this and other common console errors.
参见jQuery DataTables:关于此和其他常见控制台错误的更多信息,请参见常见的JavaScript控制台错误。
#1
7
CAUSE
Number of items in array specified by columns
option should match number of <td>
elements. You have 12 elements in columns
array and 13 <td>
elements.
列选项指定的数组中项的数量应该与元素的数量匹配。在列数组中有12个元素,13个元素。
From the manual:
从手册:
Note that if you use
columns
to define your columns, you must have an entry in the array for every single column that you have in your table (these can benull
if you don't which to specify any options).注意,如果使用列来定义列,则必须在数组中为表中每个列指定一个条目(如果不指定任何选项,这些条目可以为null)。
SOLUTION
Add extra object to columns
array to match number of columns in the HTML.
向列数组添加额外的对象,以匹配HTML中的列数。
Alternatively you can replace columns
with columnDefs
entirely for readability.
或者,您可以完全用columnDefs替换列,以提高可读性。
"columnDefs": [{
"orderable": false,
"searchable": false,
"targets": [0]
}, {
"orderable": false,
"targets": [2, 3, 11, 12]
}
],
LINKS
See jQuery DataTables: Common JavaScript console errors for more information on this and other common console errors.
参见jQuery DataTables:关于此和其他常见控制台错误的更多信息,请参见常见的JavaScript控制台错误。