Export Button Bug
Hi
I have experience bug when i have 2 modal that had a table in there , when i export the excel file on 1st modal it work but when i try to go on 2nd modal then export the table im downloading the excel of the first modal not the current modal
how can i make this work any recommended to solve this?
here is the source link
https://preview.keenthemes.com/html/metronic/docs/general/datatables/buttons/export
Replies (6)
Hi John Lloyd,
Sorry for the delay in response. To provide a more accurate solution, I'd need to see the relevant parts of your code where the issue is occurring. Could you please share the code snippets related to the modals and the export functionality so I can better understand the problem?
i already make it work thanks
Glad to hear you were able to resolve the issue! If you have any more questions or need further assistance in the future, feel free to ask.
How to sort a column that have negative and positive values on datatable?
Hi,
One possible way to sort a column that has negative and positive values on datatables.net is to use a custom sorting plugin that can ignore the values that are zero or below. You can create your plugin by modifying the existing ones, such as the ones available here:
https://datatables.net/plug-ins/sorting/
Here is an example of a custom sorting plugin that can sort only the positive values in a column:
function ignoreZeroOrBelow (a, b, high) {
a = parseFloat (a);
a = a>0 ? a : high;
b = parseFloat (b);
b = b>0 ? b : high;
return ( (a < b) ? -1 : ( (a > b) ? 1 : 0));
}
jQuery.extend ( jQuery.fn.dataTableExt.oSort, {
"sort-positive-numbers-only-asc": function (a, b) {
return ignoreZeroOrBelow (a, b, Number.POSITIVE_INFINITY);
},
"sort-positive-numbers-only-desc": function (a, b) {
return ignoreZeroOrBelow (a, b, Number.NEGATIVE_INFINITY)*-1;
}
});You can use this plugin by specifying the type and the target column in the columnDefs option, like this:
var dataTable = $ ("#example").dataTable ( {
columnDefs: [
{ type: "sort-positive-numbers-only", targets : 0 }
],
});This plugin works by replacing the values that are zero or below with either Number.POSITIVE_INFINITY or Number.NEGATIVE_INFINITY, depending on the sorting order. This way, only the positive values are compared and sorted. You can see a demo of this plugin here:
https://jsfiddle.net/scuo0t6k/
I hope this helps you with your problem.
Thank you
Hi John Lloyd,
Instead of using the same ID for export buttons in different modals, use unique IDs for each modal. This way, each export button will be associated with the correct DataTable instance.
Make sure that the click event for the export button is properly scoped to the current modal. This ensures that only the export button within the current modal is triggered when clicked.
Here's an updated version of your export button logic:
var exportButtons = (tableId, menuId) => {
const documentTitle = "ATL Payments - " + modalWeekLabel + " | Week Coverage - " + modalWeekCoverage;
const fileName = "ATL Payments - " + modalWeekLabel;
var buttons = new $.fn.dataTable.Buttons(tableId, {
buttons: [
{
extend: "excelHtml5",
title: documentTitle,
filename: fileName,
},
{
extend: "pdfHtml5",
title: documentTitle,
filename: fileName,
},
],
})
.container()
.appendTo($("#" + menuId));
};
// Usage
var totalATLCollectionTable = $("#atl_table").DataTable({ ... });
var exportMenuId = "export-menu5"; // Unique ID for export menu in modal 1
exportButtons(totalATLCollectionTable, exportMenuId);
var totalDealerCollectionTable = $("#dealer_table").DataTable({ ... });
var exportMenuId2 = "export-menu4"; // Unique ID for export menu in modal 2
exportButtons(totalDealerCollectionTable, exportMenuId2);Make sure to update the export button IDs (export-menu5, export-menu4) in your HTML accordingly.
