adjustment for responsive mode

adjustment for responsive mode

anakin59490anakin59490 Posts: 20Questions: 7Answers: 0
edited June 2019 in Free community support

I don't find the way in API to adjust this two detail : number of page displayed between next and prévious
and the search colum area

code is standard :

getLanguage(): any {
        return {
            lengthMenu: 'Afficher _MENU_ enregistrements par page',
            zeroRecords: 'Aucun enregistrement disponible',
            info: '_START_ à _END_ sur _TOTAL_ enregistrements',
            // info: ' Page _PAGE_ sur _PAGES_',
            infoEmpty: 'Aucun enregistrement disponible',
            infoFiltered: '(filtré(s) sur _MAX_ enregistrements)',
            paginate: {
                first:      '<<',
                last:       '>>',
                next:       '>',
                previous:   '<'
            },
            search: '_INPUT_',
            searchPlaceholder: 'Recherche',

        }
    }

HTML footer:

<tfoot>
        <tr>
            <th>Recherche</th>
            <th><input type="text" placeholder="Id" name="search-identifiant"/></th>
            <th><input type="text" placeholder="Nom" name="search-nom"/></th>
            <th><input type="text" placeholder="Prénom" name="search-prenom"/></th>
           <th>Action</th>
        </tr>
 </tfoot>

Thank you for your help

This question has accepted answers - jump to:

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    Hi @anakin59490 ,

    There's no API method to control the paging display, and it doesn't automatically resize responsively, but you can add that logic into a paging plugin as it would be called on each table draw. For example, this is the number_no_ellipses plugin, with a console message displayed on each draw.

    Cheers,

    Colin

  • anakin59490anakin59490 Posts: 20Questions: 7Answers: 0

    Hi @colin ,

    thank's a lot

  • anakin59490anakin59490 Posts: 20Questions: 7Answers: 0
    edited June 2019

    Hi @colin ,

    I try to use this plugin.
    1) I have added the js file
    "node_modules/datatables.net-plugins/pagination/full_numbers_no_ellipses.js",

    2) I have updated "pagingType" :
    // pagingType: 'full_numbers',
    pagingType: 'full_numbers_no_ellipses',

    But I get the following message :

    ERROR TypeError: Cannot read property 'fnInit' of undefined
    at _fnFeatureHtmlPaginate (jquery.dataTables.js:4856)
    at _fnAddOptionsHtml (jquery.dataTables.js:3653)
    at _fnInitialise (jquery.dataTables.js:4679)
    at HTMLTableElement.<anonymous> (jquery.dataTables.js:1339)
    at Function.each (jquery.js:362)
    at jQuery.fn.init.each (jquery.js:157)
    at jQuery.fn.init.DataTable [as dataTable] (jquery.dataTables.js:869)
    at jQuery.fn.init.$.fn.DataTable (jquery.dataTables.js:15105

    What is missing ?

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    Hi @anakin59490 ,

    You would get that error if the DataTables initialisation couldn't find the requested pagingType plugin, so it looks like your step 1 above isn't loading the file as expected.

    Cheers,

    Colin

This discussion has been closed.