Ottimizzazione selezione righe per le tabelle
This commit is contained in:
parent
5523b3db7d
commit
11a2ede111
25
ajax.php
25
ajax.php
|
@ -140,30 +140,5 @@ switch (filter('op')) {
|
|||
|
||||
echo json_encode($response);
|
||||
|
||||
break;
|
||||
|
||||
// Impostazione di selezione di tutti le righe della tabella
|
||||
case 'table-row-selection':
|
||||
$row_ids = filter('row_ids');
|
||||
$type = filter('type');
|
||||
$selected = &$_SESSION['module_'.$id_module]['selected'];
|
||||
|
||||
if (isset($row_ids)) {
|
||||
foreach ($row_ids as $row_id) {
|
||||
if (!isset($row_id)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// Toggle per la riga indicata
|
||||
if ($type == 'deselect' && isset($selected[$row_id])) {
|
||||
unset($selected[$row_id]);
|
||||
} elseif ($type == 'select') {
|
||||
$selected[$row_id] = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
echo json_encode(array_keys($selected));
|
||||
|
||||
break;
|
||||
}
|
||||
|
|
|
@ -1,30 +1,30 @@
|
|||
$(document).ready(function () {
|
||||
// Pulsanti di Datatables
|
||||
$(".btn-csv").click(function (e) {
|
||||
$(".btn-csv").off("click").on("click", function (e) {
|
||||
var table = $(document).find("#" + $(this).closest("[data-target]").data("target")).DataTable();
|
||||
|
||||
table.buttons(0).trigger();
|
||||
});
|
||||
|
||||
$(".btn-excel").click(function (e) {
|
||||
$(".btn-excel").off("click").on("click", function (e) {
|
||||
var table = $(document).find("#" + $(this).closest("[data-target]").data("target")).DataTable();
|
||||
|
||||
table.buttons(3).trigger();
|
||||
});
|
||||
|
||||
$(".btn-pdf").click(function (e) {
|
||||
$(".btn-pdf").off("click").on("click", function (e) {
|
||||
var table = $(document).find("#" + $(this).closest("[data-target]").data("target")).DataTable();
|
||||
|
||||
table.buttons(4).trigger();
|
||||
});
|
||||
|
||||
$(".btn-copy").click(function (e) {
|
||||
$(".btn-copy").off("click").on("click", function (e) {
|
||||
var table = $(document).find("#" + $(this).closest("[data-target]").data("target")).DataTable();
|
||||
|
||||
table.buttons(1).trigger();
|
||||
});
|
||||
|
||||
$(".btn-print").click(function (e) {
|
||||
$(".btn-print").off("click").on("click", function (e) {
|
||||
var table = $(document).find("#" + $(this).closest("[data-target]").data("target")).DataTable();
|
||||
|
||||
table.buttons(2).trigger();
|
||||
|
@ -51,14 +51,12 @@ $(document).ready(function () {
|
|||
var row_ids = response.data.map(function(a) {return a.id;});
|
||||
|
||||
// Chiamata di selezione completa
|
||||
rowSelection(wrapper, "select", row_ids).then(function () {
|
||||
wrapper.addSelectedRows(row_ids);
|
||||
table.clear().draw();
|
||||
|
||||
$("#main_loading").hide();
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
$(".btn-select-none").click(function () {
|
||||
|
@ -68,27 +66,24 @@ $(document).ready(function () {
|
|||
|
||||
// Chiamata di deselezione completa
|
||||
var row_ids = wrapper.getSelectedRows();
|
||||
rowSelection(wrapper, "deselect", row_ids).then(function () {
|
||||
wrapper.removeSelectedRows(row_ids);
|
||||
table.clear().draw();
|
||||
})
|
||||
});
|
||||
|
||||
$(document).on("click", ".select-checkbox", function () {
|
||||
var row = $(this).parent();
|
||||
var row_id = row.attr("id");
|
||||
|
||||
var table_selector = $(this).closest(".dataTable");
|
||||
var wrapper = getTable(table_selector);
|
||||
|
||||
var type;
|
||||
if (row.hasClass("selected")) {
|
||||
//table.datatable.rows("#" + row_id).select();
|
||||
type = "select";
|
||||
wrapper.addSelectedRows(row_id);
|
||||
} else {
|
||||
//table.datatable.rows("#" + row_id).deselect();
|
||||
type = "deselect";
|
||||
wrapper.removeSelectedRows(row_id);
|
||||
}
|
||||
|
||||
rowSelection(wrapper, type, row_id);
|
||||
});
|
||||
|
||||
$(".bulk-action").click(function () {
|
||||
|
|
|
@ -44,9 +44,7 @@ function start_datatables() {
|
|||
var tempo_attesa_ricerche = (globals.tempo_attesa_ricerche * 1000);
|
||||
|
||||
$this.on('preInit.dt', function (ev, settings) {
|
||||
if ($(ev.target).hasClass("main-records")) {
|
||||
$('#mini-loader').show();
|
||||
}
|
||||
});
|
||||
|
||||
var table = $this.DataTable({
|
||||
|
@ -255,15 +253,6 @@ function start_datatables() {
|
|||
$(this).parent().addClass("clickable");
|
||||
});
|
||||
|
||||
var container = $(document).find('[data-target=' + $this.attr('id') + ']');
|
||||
if (api.rows({
|
||||
selected: true
|
||||
}).count() > 0) {
|
||||
container.find('.table-btn').removeClass('disabled').attr('disabled', false);
|
||||
} else {
|
||||
container.find('.table-btn').addClass('disabled').attr('disabled', true);
|
||||
}
|
||||
|
||||
// Reimposto il flag sulle righe ricaricate selezionate in precedenza
|
||||
var selected = $this.data('selected') ? $this.data('selected').split(';') : [];
|
||||
table.rows().every(function (rowIdx) {
|
||||
|
@ -343,7 +332,7 @@ function getTableSearch() {
|
|||
var search = getUrlVars();
|
||||
|
||||
globals.search.forEach(function (value, index, array) {
|
||||
if (search[array[index]] == undefined) {
|
||||
if (search[array[index]] === undefined) {
|
||||
search[array[index]] = array[value];
|
||||
}
|
||||
});
|
||||
|
@ -351,37 +340,6 @@ function getTableSearch() {
|
|||
return search;
|
||||
}
|
||||
|
||||
/**
|
||||
* Invia una richiesta di selezione per un insieme di righe delle tabelle Datatables.
|
||||
*/
|
||||
function rowSelection(wrapper, type, row_ids) {
|
||||
return $.ajax({
|
||||
url: globals.rootdir + "/ajax.php",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: {
|
||||
id_module: wrapper.id_module,
|
||||
id_plugin: wrapper.id_plugin,
|
||||
op: "table-row-selection",
|
||||
type: type,
|
||||
row_ids: row_ids,
|
||||
},
|
||||
success: function (selected) {
|
||||
wrapper.table.data('selected', selected.join(';'));
|
||||
|
||||
var bulk_container = wrapper.getActionsContainer();
|
||||
var btn_container = wrapper.getButtonsContainer();
|
||||
if (selected.length > 0) {
|
||||
bulk_container.removeClass('disabled').attr('disabled', false);
|
||||
btn_container.removeClass('disabled').attr('disabled', false);
|
||||
} else {
|
||||
bulk_container.addClass('disabled').attr('disabled', true);
|
||||
btn_container.addClass('disabled').attr('disabled', true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Restituisce un oggetto che permette di gestire le tabelle DataTables.
|
||||
*
|
||||
|
@ -390,36 +348,73 @@ function rowSelection(wrapper, type, row_ids) {
|
|||
function getTable(selector) {
|
||||
var table = $(selector);
|
||||
|
||||
if (!$.fn.DataTable.isDataTable(table)) {
|
||||
if(table.hasClass('datatables')){
|
||||
var selected = new Map();
|
||||
var selected_ids = table.data('selected') ? table.data('selected').split(';') : [];
|
||||
selected_ids.forEach(function(item, index) {
|
||||
selected.set(item, true);
|
||||
});
|
||||
|
||||
return {
|
||||
table: table,
|
||||
|
||||
id_module: table.data('idmodule'),
|
||||
id_plugin: table.data('idplugin'),
|
||||
|
||||
initDatatable: function() {
|
||||
if (table.hasClass('datatables')) {
|
||||
start_local_datatables();
|
||||
} else {
|
||||
start_datatables();
|
||||
}
|
||||
}
|
||||
|
||||
var id_module = table.data('idmodule');
|
||||
var id_plugin = table.data('idplugin');
|
||||
|
||||
var datatable = table.DataTable();
|
||||
|
||||
return {
|
||||
table: table,
|
||||
id_module: id_module,
|
||||
id_plugin: id_plugin,
|
||||
datatable: datatable,
|
||||
getSelectedRows: function () {
|
||||
var list = table.data('selected');
|
||||
return list ? list.split(';') : [];
|
||||
},
|
||||
setSelectedRows: function (list) {
|
||||
return table.data('selected', list.join(';'));
|
||||
},
|
||||
datatable: table.DataTable(),
|
||||
|
||||
// Funzioni per i contenitori relativi alla tabella
|
||||
getButtonsContainer: function () {
|
||||
return $('.row[data-target="' + table.attr('id') + '"]').find('.table-btn');
|
||||
},
|
||||
getActionsContainer: function () {
|
||||
return $('.row[data-target="' + table.attr('id') + '"]').find('.bulk-container');
|
||||
},
|
||||
|
||||
// Gestione delle righe selezionate
|
||||
selected: selected,
|
||||
getSelectedRows: function () {
|
||||
return Array.from(selected.keys());
|
||||
},
|
||||
saveSelectedRows: function () {
|
||||
var selected_rows = this.getSelectedRows();
|
||||
table.data('selected', selected_rows.join(';'));
|
||||
|
||||
var bulk_container = this.getActionsContainer();
|
||||
var btn_container = this.getButtonsContainer();
|
||||
if (selected_rows.length > 0) {
|
||||
bulk_container.removeClass('disabled').attr('disabled', false);
|
||||
btn_container.removeClass('disabled').attr('disabled', false);
|
||||
} else {
|
||||
bulk_container.addClass('disabled').attr('disabled', true);
|
||||
btn_container.addClass('disabled').attr('disabled', true);
|
||||
}
|
||||
},
|
||||
addSelectedRows: function (row_ids) {
|
||||
row_ids = Array.isArray(row_ids) ? row_ids : [row_ids];
|
||||
row_ids.forEach(function(item, index) {
|
||||
selected.set(item, true);
|
||||
});
|
||||
|
||||
this.saveSelectedRows();
|
||||
},
|
||||
removeSelectedRows: function (row_ids) {
|
||||
row_ids = Array.isArray(row_ids) ? row_ids : [row_ids];
|
||||
row_ids.forEach(function(item, index) {
|
||||
selected.delete(item);
|
||||
});
|
||||
|
||||
this.saveSelectedRows();
|
||||
},
|
||||
clearSelectedRows: function () {
|
||||
selected.clear();
|
||||
this.saveSelectedRows();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -51,7 +51,7 @@ const JS = gulp.parallel(() => {
|
|||
debugging: config.debug,
|
||||
}))
|
||||
.pipe(concat('app.min.js'))
|
||||
//.pipe(minifyJS())
|
||||
.pipe(minifyJS())
|
||||
.pipe(gulp.dest(config.production + '/' + config.paths.js));
|
||||
}, srcJS);
|
||||
|
||||
|
@ -68,7 +68,7 @@ function srcJS() {
|
|||
config.development + '/' + config.paths.js + '/functions/*.js',
|
||||
])
|
||||
.pipe(concat('functions.min.js'))
|
||||
.pipe(minifyJS())
|
||||
//.pipe(minifyJS())
|
||||
.pipe(gulp.dest(config.production + '/' + config.paths.js));
|
||||
|
||||
return merge(js, indip);
|
||||
|
|
|
@ -77,7 +77,7 @@ if (!empty($type) && $type != 'menu' && $type != 'custom') {
|
|||
|
||||
$table_id = 'main_'.rand(0, 99);
|
||||
echo '
|
||||
<table data-idmodule="'.$id_module.'" data-selected="'.implode(';', $selezione).'" data-idplugin="'.$id_plugin.'" data-idparent="'.$id_record.'" id="'.$table_id.'" width="100%" class="main-records table table-condensed table-bordered">
|
||||
<table data-idmodule="'.$id_module.'" data-idplugin="'.$id_plugin.'" data-idparent="'.$id_record.'" data-selected="'.implode(';', $selezione).'" id="'.$table_id.'" width="100%" class="main-records table table-condensed table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th id="th_selector"></th>';
|
||||
|
@ -177,6 +177,7 @@ if (!empty($type) && $type != 'menu' && $type != 'custom') {
|
|||
</div>
|
||||
|
||||
<div class="col-md-5 text-right">
|
||||
<i class="fa fa-question-circle tip" title="'.tr('Le operazioni di esportazione, copia e stampa sono limitate alle righe selezionate e visibili della tabella').'. '.tr('Per azioni su tutti i contenuti selezionati, utilizzare le Azioni di gruppo').'."></i>
|
||||
<div class="btn-group" role="group">';
|
||||
|
||||
if (setting('Abilita esportazione Excel e PDF')) {
|
||||
|
|
Loading…
Reference in New Issue