是否有任何选项可以为数据表中的 csv 按钮提供工具提示? 我关于这个 csv 按钮的代码如下:
$('#example').dataTable( {
"bProcessing": true,
//"bServerSide": true,
"sAjaxSource": "datatabledb.php",
"bJQueryUI": true,
"sPaginationType": "full_numbers",
//"sDom": 'T<"clear">rt',
"sDom": 'T<"clear">lfrtip',
"oTableTools": {
"aButtons": [
{
"sExtends": "csv",
"sButtonText": "Save to CSV",
"bFooter":false }
]
},
"oLanguage": {
"sSearch": "Search all columns:"
},
"aoColumns": [
null,
{ "bSortable": false }, // disable the sorting property for checkbox header
null,
null,
null,
null,
null,
null,
null,
null
]
} );
请帮助我。
提前致谢。
您可以使用 sTooltip :
"aButtons": [{
"sExtends": "csv",
"sButtonText": "Save to CSV",
"sTooltip": "My CSV button's tooltip",
"bFooter": false
}]
请参阅此处sFlash按钮选项部分中的工具提示选项
编辑 根据Srimanta的说法,“sTooltip”需要在“bFooter”之前才能工作。
El HTML:
<table id="tabla-usuario" class="table table-bordered w-100" style="width: 100%;">
<thead>
<tr>
<th>Opciones</th>
<th>Usuario</th>
<th>Nombre</th>
<th>Apellidos</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th>Opciones</th>
<th>Usuario</th>
<th>Nombre</th>
<th>Apellidos</th>
</tr>
</tfoot>
</table>
El JavaScript:
$('#tabla-usuario').dataTable({
lengthMenu: [[ -1, 5, 10, 25, 75, 100, 200,], ["Todos", 5, 10, 25, 75, 100, 200, ]],//mostramos el menú de registros a revisar
"aProcessing": true,//Activamos el procesamiento del datatables
"aServerSide": true,//Paginación y filtrado realizados por el servidor
dom:"<'row'<'col-md-3'B><'col-md-3 float-left'l><'col-md-6'f>r>t<'row'<'col-md-6'i><'col-md-6'p>>",//Definimos los elementos del control de tabla
buttons: [ 'copy', 'excel', 'pdf' ],
"ajax": {
url: '../ajax/usuario.php?op=listar',
type: "get",
dataType: "json",
error: function (e) {
console.log(e.responseText);
},
complete: function () {
$(".buttons-copy").attr('data-bs-toggle', 'tooltip').attr('data-bs-original-title', 'Copiar');
$(".buttons-excel").attr('data-bs-toggle', 'tooltip').attr('data-bs-original-title', 'Excel');
$(".buttons-pdf").attr('data-bs-toggle', 'tooltip').attr('data-bs-original-title', 'PDF');
$('[data-bs-toggle="tooltip"]').tooltip();
},
},
language: {
lengthMenu: "Mostrar: _MENU_ registros",
buttons: { copyTitle: "Tabla Copiada", copySuccess: { _: "%d líneas copiadas", 1: "1 línea copiada", }, },
sLoadingRecords: '<i class="fas fa-spinner fa-pulse fa-lg"></i> Cargando datos...'
},
"bDestroy": true,
"iDisplayLength": 10,//Paginación
"order": [[2, "desc"]]//Ordenar (columna,orden)
}).DataTable();
结果: