src/main/webapp/js/table.js
/**
         * Creates the data table instance for the specified table element.
         */
Creates the data table instance for the specified table element.
Creates the data table instance for the specified table element .
function createDataTable(table) {
            const defaultConfiguration = {
                language: {
                    emptyTable: 'Loading - please wait ...'
                },
                deferRender: true,
                pagingType: 'numbers', 
                order: [[1, 'asc']], 
                columnDefs: [
                    {
                        targets: 'nosort', 
                        orderable: false
                    },
                    {
                        targets: 'text-end', 
                        className: 'text-end'
                    },
                    {
                        targets: 'date', 
                        render: function (data, type, _row, _meta) {
                            if (type === 'display') {
                                if (data === 0) {
                                    return '-';
                                }
                                var dateTime = luxon.DateTime.fromMillis(data * 1000);
                                return '<span data-bs-toggle="tooltip" data-bs-placement="bottom" title="'
                                    + dateTime.toLocaleString(luxon.DateTime.DATETIME_SHORT) + '">'
                                    + dateTime.toRelative({locale: 'en'}) + '</span>';
                            }
                            else {
                                return data;
                            }
                        }
                    },
                    {
                        targets: 'percentage', 
                        className: 'text-end',
                        render: function (data, type, _row, _meta) {
                            if (isNaN(data)) {
                                return data;
                            }
                            return Number(data).toLocaleString(undefined,
                                {style: 'percent', minimumFractionDigits: 2});
                        }
                    },
                    {
                        targets: 'hidden', 
                        visible: false,
                        searchable: true,
                        orderable: false 
                    }
                ],
                columns: JSON.parse(table.attr('data-columns-definition'))
            };
            const tableConfiguration = JSON.parse(table.attr('data-table-configuration'));
            const dataTable = table.DataTable(Object.assign(defaultConfiguration, tableConfiguration));
            if (tableConfiguration.buttons) {
                dataTable
                    .buttons()
                    .container()
                    .addClass('float-none mb-3')
                    .prependTo($(dataTable.table().container()).closest('.table-responsive'));
            }
            return dataTable;
        }
function createDataTable ( table ) { const defaultConfiguration = { language : { emptyTable : 'Loading - please wait ...' } , deferRender : true , pagingType : 'numbers' , order : [ [ 1 , 'asc' ] ] , columnDefs : [ { targets : 'nosort' , orderable : false } , { targets : 'text-end' , className : 'text-end' } , { targets : 'date' , render : function ( data , type , _row , _meta ) { if ( type === 'display' ) { if ( data === 0 ) { return '-' ; } var dateTime = luxon . DateTime . fromMillis ( data * 1000 ) ; return '<span data-bs-toggle="tooltip" data-bs-placement="bottom" title="' + dateTime . toLocaleString ( luxon . DateTime . DATETIME_SHORT ) + '">' + dateTime . toRelative ( { locale : 'en' } ) + '</span>' ; } else { return data ; } } } , { targets : 'percentage' , className : 'text-end' , render : function ( data , type , _row , _meta ) { if ( isNaN ( data ) ) { return data ; } return Number ( data ) . toLocaleString ( undefined , { style : 'percent' , minimumFractionDigits : 2 } ) ; } } , { targets : 'hidden' , visible : false , searchable : true , orderable : false } ] , columns : JSON . parse ( table . attr ( 'data-columns-definition' ) ) } ; const tableConfiguration = JSON . parse ( table . attr ( 'data-table-configuration' ) ) ; const dataTable = table . DataTable ( Object . assign ( defaultConfiguration , tableConfiguration ) ) ; if ( tableConfiguration . buttons ) { dataTable . buttons ( ) . container ( ) . addClass ( 'float-none mb-3' ) . prependTo ( $ ( dataTable . table ( ) . container ( ) ) . closest ( '.table-responsive' ) ) ; } return dataTable ; }
Creates the data table instance for the specified table element.
Creates the data table instance for the specified table element .
// page number button only // default order, if not persisted yet // All columns with the '.nosort' class in the <th> // All columns with the '.text-right' class in the <th> // All columns with the '.date' class in the <th> // All columns with the '.percentage' class in the <th> // All columns with the '.hidden' class in the <th> // There is no point in allowing sort by this column if it's not visible. // overwrite/merge the default configuration with values from the provided table configuration // add the buttons to the top of the table