web-dev-qa-db-fra.com

Comment afficher un message de données vide dans les tableaux de données

Supposons que des données vides du serveur soient parfois affichées, je souhaite afficher le message Aucune donnée trouvée dans DataTables ?. Comment est-ce possible?

jqueryjsonasp.net-mvcdatatables
65
Naruto

Si vous souhaitez personnaliser le message affiché sur une table vide, utilisez ceci:

$('#example').dataTable( {
    "oLanguage": {
        "sEmptyTable":     "My Custom Message On Empty Table"
    }
} );

Depuis Datatable 1.10, vous pouvez effectuer les opérations suivantes:

$('#example').DataTable( {
    "language": {
        "emptyTable":     "My Custom Message On Empty Table"
    }
} );

Pour le complete availble datatables, les messages personnalisés du tableau, consultez le lien suivant référence/option/langue

116
Daniel

Les versions ultérieures de dataTables ont les paramètres language suivants (extraits de ici ):

  • "infoEmpty" - affiché lorsqu'il n'y a pas d'enregistrements dans la table
  • "zeroRecords" - affiché en l'absence d'enregistrements correspondant au filtrage

par exemple.

$('#example').DataTable( {
    "language": {
        "infoEmpty": "No records available - Got it?",
    }
});

Remarque: comme les noms de propriété ne contiennent aucun caractère spécial, vous pouvez supprimer les guillemets:

$('#example').DataTable( {
    language: {
        infoEmpty: "No records available - Got it?",
    }
});
8
Gone Coding

Par défaut, la vue grille prendra soin, il suffit de passer un jeu de données vide.

1
Naruto

Il est à noter que si vous renvoyez des données côté serveur, vous devez fournir l'attribut Data même s'il n'y en a pas. Il ne lit pas les recordsTotal ou recordsFiltered mais repose sur le nombre d'objets de données

1
Antony

Tard au jeu, mais vous pouvez aussi utiliser un fichier de localisation

DataTable fournit un fichier localisé .json, qui contient la clé sEmptyTable et le message localisé correspondant.

Par exemple, il suffit de télécharger le fichier json localisé sur le fichier link ci-dessus, puis d’initialiser votre Datatable comme ceci:

$('#example').dataTable( {
    "language": {
        "url": "path/to/your/json/file.json"
    }
});

IMHO, c'est beaucoup plus propre, parce que votre contenu localisé est situé dans un fichier externe.

Cette syntaxe fonctionne pour DataTables 1.10.16, je n'ai pas testé les versions précédentes.

0
AlexB

Ceci est juste une bonne idée. Cela, vous pouvez ajouter une classe dans le corps et masquer/afficher le tableau tant qu’il n’y a pas de données dans le tableau . Cela fonctionne parfaitement pour moi. Vous pouvez concevoir un message d'erreur personnalisé NO Record Found lorsqu'il n'y a pas d'enregistrement dans la table, vous pouvez ajouter la classe "no-record" et 1 ou plus d'un enregistrement, vous pouvez supprimer la classe et afficher datatable

Voici le code jQuery.

$('#default_table').DataTable({

    // your stuff here

    "fnFooterCallback": function (nRow, aaData, iStart, iEnd, aiDisplay) {
        if (aiDisplay.length > 0) {
            $('body').removeClass('no-record');
        }
        else {
            $('body').addClass('no-record');
        }
    }
});

Voici CSS

.no-record #default_table{display:none;}

et voici le lien officiel .

0
Shurvir Mori