Creare un datatable con Grid.js

Mattepuffo's logo
Creare un datatable con Grid.js

Creare un datatable con Grid.js

Programmazione, Javascript - AJAX

Ho usato tantissimo jQuery DataTable, e l'ho sempre trovato il migliore nel suo genere.

Solo che, ad essere sincero, inizio a trovare jQuery un pò obsoleto.

Grid.js è una buona alternativa che non richiede dipendenze aggiuntive.

L'ho testato e devo dire che è molto veloce e facile da configurare.

Qui sotto un codice completo di una pagina HTML con tutto il codice Javascript necessario:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta charset="UTF-8">
        <title>TEST</title>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

        <link href="https://cdn.jsdelivr.net/npm/gridjs/dist/theme/mermaid.min.css" rel="stylesheet">

        <style>
        </style>

    </head>
    <body>
        <div id="tbl_wrapper"></div>
    </body>

    <script src="https://cdn.jsdelivr.net/npm/gridjs/dist/gridjs.umd.js"></script>
    <script>
        new gridjs.Grid({
            columns: ["Titolo", "Autore"],
            server: {
                url: 'https://www.mattepuffo.com/api/book/get.php',
                then: data => data.books.map(item =>
                    [item.title, item.author]
                )
            },
            style: {
                td: {
                    border: '1px solid #000000'
                },
                table: {
                    'font-size': '15px'
                }
            },
            search: {
                enabled: true
            },
            language: {
                'search': {
                    'placeholder': '

Condividi

Commentami!