Deeplinking and Ellipsis and Column visibilty
Deeplinking and Ellipsis and Column visibilty
xkpx
Posts: 27Questions: 5Answers: 0
Hello as title suggest there is something strange with visible: false and deeplinking + ellipsis.
When you use combination problem appear, as you shrink the table , it just dissappers in thin air.
This is tested with
Jquery 3.6.0
Bootstrap 4.6
Datatables 1.10.24 ++ Responsive 2.2.7 ++ Bootstrap4
Video: https://filebin.net/mpgsja3cay9339x5/x.mp4?t=tyos3okw
Live demo : https://xkp.ftp.sh/files.php
//$.fn.dataTable.render.multi = function(renderArray) { return function(d, type, row, meta) { for(var r = 0; r < renderArray.length; r++) { d = renderArray[r](d, type, row, meta); } return d; } }
//$.fn.dataTable.render.text = function () { return function ( data, type, row ) { if ( type === 'display' ) { var str = '<a href="#xkp-preview" data-toggle="modal" data-id="'+row.id+'" data-title="'+row.name+'" data-target="#preview-modal" data-tooltip="tooltip" title="click to view">'+data+'</a>'; return str; } return data; }; };
$(document).ready(function() {
var searchOptions = $.fn.dataTable.ext.deepLink( ['search.search'] );
var defaultOptions = {
dom: 'lBfrtip',
buttons: ['excel','pdf','print'],
processing: true,
serverSide: true,
columns: [
{ data: "id"
,visible: false
},
{ data: "name",
/* render: $.fn.dataTable.render.multi([
$.fn.dataTable.render.ellipsis( 65, false, true ),
$.fn.dataTable.render.text()
]) */
},
{ data: "size"
//,visible: false
},
{ data: "category", width: "1%" },
{ data: "sub_category", width: "1%" },
{ data: "user", width: "1%" },
{ data: "created_at", width: "1%" }
],
//columnDefs: [
//{ targets: [ 0,2 ], "visible": false, "searchable": false },
//{ targets: [3,4,5,6], width: "1%" }
//],
ajax: "server_processing.php",
};
$('#example').DataTable($.extend( defaultOptions, searchOptions ));
});
This discussion has been closed.
Answers
Another example here http://live.datatables.net/ruwutute/1/edit
uncomment // visible and check the behaviour.
Tested with nigtly too, same deal when used visible option table dissapper
http://live.datatables.net/ruwutute/11/edit?html,js,output
More and more i'am digging seems the problem is with
Responsive and targets:[x] "visible": false
I catch that nowrap wrap starts the problem
Wow yes, there is something going wrong there. I don't have an immediate solution I'm afraid, but a workaround is to set one of the narrower columns to be more important through the
responsivePriority
option: http://live.datatables.net/ruwutute/24/edit .Allan
Thanks @allan !