About Datatables language

Topic: About Datatables language

IT free asked 5 years ago

Hi! Someone knows how to choose the language of MDBDataTable?

Add comment

Piotr Glejzer staff answered 5 years ago

0 0 Best answer

Please insert min. 20 characters.

Hi,

Show entries you can change with entriesLabel | default: entriesLabel: 'Show entries'

Showing 1 to 5 of 57 entries you can change with
infoLabel: | default: infoLabel: ['Showing', 'to', 'of', 'entries']
another:
paginationLabel: ['Previous', 'Next']
searchLabel: 'Search'

We will add some more features in the next release. Check our packages on Monday and read a changelog! Have a nice day!

Best,
Piotr

Zantour Wael free commented 3 years ago

Hi , Please can u help me and tell me where did i can place this code for translation in my react js project i didn't know how i integrated .

Best, Wael

Krzysztof Wilk staff commented 3 years ago

Hi!

These customization options are component properties, so you have to use them while declaring a new MDBDatatable component :) You can read more about customization properties here, in API section (https://mdbootstrap.com/docs/react/tables/datatables/)

Keep coding!

Add comment

jouvrard pro answered 5 years ago

1 0 Best answer

<p>You can configure this by usng some DataTable options.</p>

<p>Fore Example here is my translation to french:</p>

<pre class="prettyprint"><code>$('.dataTables').DataTable({
    "language": {
        "sProcessing": "Traitement en cours...",
        "sSearch": "Rechercher&nbsp;:",
        "sLengthMenu": "Afficher _MENU_ &eacute;l&eacute;ments",
        "sInfo": "Affichage de l'&eacute;l&eacute;ment _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
        "sInfoEmpty": "Affichage de l'&eacute;l&eacute;ment 0 &agrave; 0 sur 0 &eacute;l&eacute;ment",
        "sInfoFiltered": "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
        "sInfoPostFix": "",
        "sLoadingRecords": "Chargement en cours...",
        "sZeroRecords": "Aucun &eacute;l&eacute;ment &agrave; afficher",
        "sEmptyTable": "Aucune donn&eacute;e disponible dans le tableau",
        "oPaginate": {
            "sFirst": "Premier",
            "sPrevious": "Pr&eacute;c&eacute;dent",
            "sNext": "Suivant",
            "sLast": "Dernier"
        },
        "oAria": {
            "sSortAscending": ": activer pour trier la colonne par ordre croissant",
            "sSortDescending": ": activer pour trier la colonne par ordre d&eacute;croissant"
        },
        "select": {
            "rows": {
                "_": "%d lignes sélectionnées",
                "0": "Aucune ligne sélectionnée",
                "1": "1 ligne sélectionnée"
            }
        }
    }
});
</code></pre>

Please insert min. 20 characters.

You can configure this by usng some DataTable options.

Fore Example here is my translation to french:

$('.dataTables').DataTable({
    "language": {
        "sProcessing": "Traitement en cours...",
        "sSearch": "Rechercher&nbsp;:",
        "sLengthMenu": "Afficher _MENU_ &eacute;l&eacute;ments",
        "sInfo": "Affichage de l'&eacute;l&eacute;ment _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
        "sInfoEmpty": "Affichage de l'&eacute;l&eacute;ment 0 &agrave; 0 sur 0 &eacute;l&eacute;ment",
        "sInfoFiltered": "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
        "sInfoPostFix": "",
        "sLoadingRecords": "Chargement en cours...",
        "sZeroRecords": "Aucun &eacute;l&eacute;ment &agrave; afficher",
        "sEmptyTable": "Aucune donn&eacute;e disponible dans le tableau",
        "oPaginate": {
            "sFirst": "Premier",
            "sPrevious": "Pr&eacute;c&eacute;dent",
            "sNext": "Suivant",
            "sLast": "Dernier"
        },
        "oAria": {
            "sSortAscending": ": activer pour trier la colonne par ordre croissant",
            "sSortDescending": ": activer pour trier la colonne par ordre d&eacute;croissant"
        },
        "select": {
            "rows": {
                "_": "%d lignes sélectionnées",
                "0": "Aucune ligne sélectionnée",
                "1": "1 ligne sélectionnée"
            }
        }
    }
});

IT free commented 5 years ago

Sorry, but this solution doesnt help me, i cant modify the DOM because of React, thank you btw

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB React
MDB Version: 4.20.0
Device: PC
Browser: Mozilla
OS: Windows10
Provided sample code: No
Provided link: No

IT

5Support score
1Questions 0Answers 0Snippets