javascript - 如何将datatable javaScript数据导出到eccel,不导出隐藏列,但不影响隐藏响应数据?
问题描述
除了具有主动响应功能外,我还有一个数据表,通过我显示和/或隐藏列的检查形式;这使得一些数据在第一列中的 + 下拉菜单中隐藏。问题是在导出数据表时,它会导出所有数据,甚至是隐藏的数据。如果我在导出按钮的配置中添加 exportOptions: {columns: ': visible'}} 只导出表的可见数据,它不会导出响应隐藏的数据,因为我可以导出所有活动数据数据表,也就是说只有响应者才能看到和隐藏?
实现是使用数据表和 jquery
/*With this function I create the table*/
function reloadtable(datos, tabla, alertIS, jqform) {
tablaret = $('#' + tabla).DataTable({
destroy: true,
data: datos,
scrollCollapse: true,
autoWidth: false,
responsive: true,
columnDefs: [
{
"title": "Ejecución",
"targets": 0,
"createdCell": function(td, cellData, rowData, row, col) {}
},
{
"title": "Estado",
"targets": 1,
"createdCell": function(td, cellData, rowData, row, col) {
if (alertIS == true) {
let background = "";
let paso;
if (cellData == "Finalizado" || cellData == "Cancelada" || cellData == "En Proceso") {
switch (cellData) {
case "Finalizado":
background = '#004DFF';
break;
case "Cancelada":
background = '#BABABA';
break;
case "En Proceso":
background = '#FFAA00';
break;
default:
background = '#FFFFFF';
break;
}
} else {
console.log(rowData["ejecucion"]);
console.log();
background = evalfechaByColor(rowData["ejecucion"], rowData["TareaRangoFin"]);
if (background != "#000000" && cellData == "Sin Asignar") {
background = "#0008FF"
}
}
let color = background == "#000000" ? "#ffffff" : "#000000"
$(td).css('border', 'solid 5px #FFFFFF');
$(td).css('border-radius', '1rem');
$(td).css('color', color);
$(td).css('background', background);
}
}
},
{
"title": "Cod tarea",
"targets": 2,
}, {
"title": "Usuario de campo",
"targets": 3,
},
{
"title": "Prioridad",
"targets": 4,
},
{
"title": "Cliente",
"targets": 5,
},
{
"title": "Doc cliente",
"targets": 6,
},
{
"title": "Dirección",
"targets": 7,
},
{
"title": "Teléfono 1",
"targets": 8,
},
{
"title": "Teléfono 2",
"targets": 9,
},
{
"title": "Sede",
"targets": 10,
},
{
"title": "Campaña",
"targets": 11,
},
{
"title": "Zona",
"targets": 12,
},
{
"title": "Ajendamientos",
"targets": 13,
},
{
"title": "Tipo tarea",
"targets": 14,
},
{
"title": "Tipo de servicio",
"targets": 15,
},
{
"title": "Novedad",
"targets": 16,
}, {
"title": "Tipo vehoculo",
"targets": 17,
},
{
"title": "Peso",
"targets": 18,
},
{
"title": "Cantidad",
"targets": 19,
},
{
"title": "Volumen",
"targets": 20,
},
{
"title": "Creación",
"targets": 21,
},
{
"title": "Inicio recorrido",
"targets": 22,
},
{
"title": "Fin recorrido",
"targets": 23,
},
{
"title": "Inicio de tarea",
"targets": 24,
},
{
"title": "fion de tarea",
"targets": 25,
},
{
"title": "Inicio de rango",
"targets": 26,
},
{
"title": "Fin de rango",
"targets": 27,
},
{
"title": "Tim Est de tarea",
"targets": 28,
},
{
"title": "Tiempo de tarea",
"targets": 29,
},
{
"title": "Tim Est Recorrido",
"targets": 30,
},
{
"title": "Tiempo recorrido",
"targets": 31,
},
{
"title": "Orden",
"targets": 32,
},
{
"title": "calificaíon",
"targets": 33,
},
{
"title": "Comentarios calificacíon",
"targets": 34,
},
{
"title": "notas",
"targets": 35,
},
{
"title": "Opciones",
"targets": 36,
}
],
columns: [{
data: "ejecucion"
},
{
data: 'estado'
},
{
data: 'codetarea'
},
{
data: 'nameDriver'
},
{
data: 'prioridad'
},
{
data: 'nomClient'
},
{
data: 'identiClient'
},
{
data: 'direction'
},
{
data: 'tel1'
},
{
data: 'tel2'
},
{
data: 'sede'
},
{
data: 'campaña'
},
{
data: 'zona'
},
{
data: 'ajendamientos'
},
{
data: 'tipoTarea'
},
{
data: 'typeService'
},
{
data: 'prsNoved'
},
{
data: 'tipvehi'
},
{
data: 'peso'
},
{
data: 'piezaCant'
},
{
data: 'volumen'
},
{
data: 'creation'
},
{
data: 'RecHoraIn'
},
{
data: 'RecHoraFin'
},
{
data: 'TareaHoraIn'
},
{
data: 'TareaHoraFin'
},
{
data: 'TareaRangoIn'
},
{
data: 'TareaRangoFin'
},
{
data: 'TareaTiempoEst'
},
{
data: 'TareaTiempoReal'
},
{
data: 'RecTiempoEst'
},
{
data: 'RecTiempoReal'
},
{
data: 'idRel'
},
{
data: 'rate'
},
{
data: 'rateObs'
},
{
data: 'notas'
},
{
"mData": null,
"bSortable": false,
"mRender": function(data, type, full) {
let obsi = "";
if (alertIS == true) {
obsi = `
<button id='delet' class='btn btn-info mx-1' onclick='info("` + full['key'] + `")'><i class='fa fa-search'></i></button>
<button id='infocierre' class='btn btn-success mx-1' onclick='ifoClose("` + full['key'] + `")'><i class='fas fa-clipboard-check'></i></button>
`
}
return obsi;;
}
}
],
"lengthMenu": [
[10, 25, 50, -1],
[10, 25, 50, "Todos"]
],
"language": configLanguafetable,
dom: "<'d-block d-md-flex justify-content-md-around'<'my-2'l><B><f>>" + "rtip",
buttons: [{
extend: 'copy',
text: "Copiar",
exportOptions: {
// columns: ':visible'
}
},
{
extend: 'excel',
exportOptions: {
//columns: ':visible'
}
},
{
extend: 'csv',
exportOptions: {
// columns: ':visible'
}
},
{
extend: 'pdf',
exportOptions: {
// columns: ':visible'
}
},
{
extend: 'print',
exportOptions: {
// columns: ':visible'
}
},
],
});
return tablaret;
}
//With this function I create the form
function CreaCtlVosibletable(form) {
let DataTar = ["Todos",
"Ejecución", "Estado", "Cod tarea", "Usuario de campo", "Prioridad", "Cliente", "Doc cliente", "Dirección", "Teléfono 1", "Teléfono 2", "Sede", "Campaña", "Zona", "Ajendamientos", "Tipo tarea", "Tipo de servicio", "Novedad", "Tipo vehoculo", "Peso", "Cantidad", "Volumen", "Creación", "Inicio recorrido", "Fin recorrido", "Inicio de tarea", "fion de tarea", "Inicio de rango", "Fin de rango", "Tim Est de tarea", "Tiempo de tarea", "Tim Est Recorrido", "Tiempo recorrido", "Orden", "calificaíon", "Comentarios calificacíon",
"Obciones"
]
DataTar.forEach((element1, index) => {
activo = index < 7 && index > 0 ? "checked" : ""
let itemName = element1.replace(/\b\w/g, l => l.toUpperCase()).replace(/ /gi, "")
if (index < (DataTar.length)) {
$("#" + form).append(`
<div class="btn-group" >
<label class="btn btn-primary">
<input type="checkbox" name="` + itemName + `" id="` + itemName + `" ` + activo + ` autocomplete="off">
` + element1 + `
</label>
</div>
`);
}
})
}
//with this hidden function and I show columns
function chageVicibleTable(tabla, jqform) {
$("#" + jqform + " input").each(function(index, element) {
if (element.id != "Todos" && index != element.id != "Opciones") {
let active = $("#" + this.id).prop('checked') == true || $("#Todos").prop('checked') == true ? true : false;
tabla.columns(index - 1).visible(active);
}
enter code here
})
tabla.columns.adjust().draw();
}
解决方案
推荐阅读
- excel - 通过 GetOpenFilename 选择新工作簿后如何选择特定工作表
- python - 如何在不打开 CMD 窗口的情况下通过 subprocess.call() 运行 CMD 命令?
- javascript - 在strophejs中如何维护多个连接
- unit-testing - flask (werkzeug) 2.0 测试 GET (client.get(url, data=data)) 方法不使用数据/有效负载
- python - 尝试对已聚合的数据进行聚合查询 - 不确定使用的最佳方法
- c# - 为什么需要我在 DbContext 类中将视图模型定义为 DbSet?
- winapi - 我需要一些额外的步骤来注册对 DeviceContext 的更改吗?
- python - 来自 for 循环的多个子图共享一个颜色条
- python - 如何在 python 中使用不同大小的数据集训练 GMM?
- c# - Windows 上 wsl2 容器内的 System.Device.Gpio 抛出 Missing '/sys/class/gpio'