I store, in a session variable, which language does user wants to translate but I don't know to pass it DataTables
I found this explanation on the datatables website but that didn't really help, where do I set language param ?
This question is related to
jquery
datatables
There are language files uploaded in a CDN on the dataTables website https://datatables.net/plug-ins/i18n/ So you only have to replace "Spanish" with whatever language you are using in the following example.
https://datatables.net/plug-ins/i18n/Spanish
$('table.dataTable').DataTable( {
language: {
url: '//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json'
}
});
If you are using Angular and Firebase, you can also use the DTOptionsBuilder :
angular.module('your_module', [
'ui.router',
'oc.lazyLoad',
'ui.bootstrap',
'ngSanitize',
'firebase']).controller("your_controller", function ($scope, $firebaseArray, DTOptionsBuilder) {
var ref = firebase.database().ref().child("your_database_table");
// create a synchronized array
$scope.your_database_table = $firebaseArray(ref);
ref.on('value', snap => {
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('language',
{
"sProcessing": "Traitement en cours...",
"sSearch": "Rechercher :",
"sLengthMenu": "Afficher _MENU_ éléments",
"sInfo": "Affichage de l'élément _START_ à _END_ sur _TOTAL_ éléments",
"sInfoEmpty": "Affichage de l'élément 0 à 0 sur 0 élément",
"sInfoFiltered": "(filtré de _MAX_ éléments au total)",
"sInfoPostFix": "",
"sLoadingRecords": "Chargement en cours...",
"sZeroRecords": "Aucun élément à afficher",
"sEmptyTable": "Aucune donnée disponible dans le tableau",
"oPaginate": {
"sFirst": "Premier",
"sPrevious": "Précédent",
"sNext": "Suivant",
"sLast": "Dernier"
},
"oAria": {
"sSortAscending": ": activer pour trier la colonne par ordre croissant",
"sSortDescending": ": activer pour trier la colonne par ordre décroissant"
}
}
)
});})
I hope this will help.
Tradução para Português Brasil
$('#table_id').DataTable({
"language": {
"sProcessing": "Procesando...",
"sLengthMenu": "Exibir _MENU_ registros por página",
"sZeroRecords": "Nenhum resultado encontrado",
"sEmptyTable": "Nenhum resultado encontrado",
"sInfo": "Exibindo do _START_ até _END_ de um total de _TOTAL_ registros",
"sInfoEmpty": "Exibindo do 0 até 0 de um total de 0 registros",
"sInfoFiltered": "(Filtrado de um total de _MAX_ registros)",
"sInfoPostFix": "",
"sSearch": "Buscar:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Cargando...",
"oPaginate": {
"sFirst": "Primero",
"sLast": "Último",
"sNext": "Próximo",
"sPrevious": "Anterior"
},
"oAria": {
"sSortAscending": ": Ativar para ordenar a columna de maneira ascendente",
"sSortDescending": ": Ativar para ordenar a columna de maneira descendente"
}
}
});
Keep in mind that you have to exactly specify your path to your language.JSON like this:
language: {
url: '/mywebsite/js/localisation/German.json'
}
sorry to revive this thread, i know there is the solution, but it is easy to change the language with the datatables. Here, i leave you with my own datatable example.
$(document).ready(function ()
// DataTable
var table = $('#tblUsuarios').DataTable({
aoColumnDefs: [
{"aTargets": [0], "bSortable": true},
{"aTargets": [2], "asSorting": ["asc"], "bSortable": true},
],
"language": {
"url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json"
}
});
The language you get from the following link:
http://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n
Just replace the URL value in the language option with the one you like. Remember to always use the comma
Worked for me, hope it will work for anyone.
Best regards!
French translations:
$('#my_table').DataTable({
"language": {
"sProcessing": "Traitement en cours ...",
"sLengthMenu": "Afficher _MENU_ lignes",
"sZeroRecords": "Aucun résultat trouvé",
"sEmptyTable": "Aucune donnée disponible",
"sInfo": "Lignes _START_ à _END_ sur _TOTAL_",
"sInfoEmpty": "Aucune ligne affichée",
"sInfoFiltered": "(Filtrer un maximum de_MAX_)",
"sInfoPostFix": "",
"sSearch": "Chercher:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Chargement...",
"oPaginate": {
"sFirst": "Premier", "sLast": "Dernier", "sNext": "Suivant", "sPrevious": "Précédent"
},
"oAria": {
"sSortAscending": ": Trier par ordre croissant", "sSortDescending": ": Trier par ordre décroissant"
}
}
});
});
Hello in wich file i have to put this code for a french translation, i don't realy understand the process for the translation
$('#userList').DataTable({
"language": {
"sProcessing": "Traitement en cours ...",
"sLengthMenu": "Afficher _MENU_ lignes",
"sZeroRecords": "Aucun résultat trouvé",
"sEmptyTable": "Aucune donnée disponible",
"sInfo": "Lignes _START_ à _END_ sur _TOTAL_",
"sInfoEmpty": "Aucune ligne affichée",
"sInfoFiltered": "(Filtrer un maximum de_MAX_)",
"sInfoPostFix": "",
"sSearch": "Chercher:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Chargement...",
"oPaginate": {
"sFirst": "Premier", "sLast": "Dernier", "sNext": "Suivant", "sPrevious": "Précédent"
},
"oAria": {
"sSortAscending": ": Trier par ordre croissant", "sSortDescending": ": Trier par ordre décroissant"
}
}
});
It is indeed
language: {
url: '//URL_TO_CDN'
}
The problem is not all of the DataTables (As of this writing) are valid JSON. The Traditional Chinese file for instance is one of them.
To get around this I wrote the following code in JavaScript:
var dataTableLanguages = {
'es': '//cdn.datatables.net/plug-ins/1.10.21/i18n/Spanish.json',
'fr': '//cdn.datatables.net/plug-ins/1.10.21/i18n/French.json',
'ar': '//cdn.datatables.net/plug-ins/1.10.21/i18n/Arabic.json',
'zh-TW': {
"processing": "???...",
"loadingRecords": "???...",
"lengthMenu": "?? _MENU_ ???",
"zeroRecords": "???????",
"info": "??? _START_ ? _END_ ???,? _TOTAL_ ?",
"infoEmpty": "??? 0 ? 0 ???,? 0 ?",
"infoFiltered": "(? _MAX_ ??????)",
"infoPostFix": "",
"search": "??:",
"paginate": {
"first": "???",
"previous": "???",
"next": "???",
"last": "????"
},
"aria": {
"sortAscending": ": ????",
"sortDescending": ": ????"
}
}
};
var language = dataTableLanguages[$('html').attr('lang')];
var opts = {...};
if (language) {
if (typeof language === 'string') {
opts.language = {
url: language
};
} else {
opts.language = language;
}
}
Now use the opts as option object for data table like
$('#list-table').DataTable(opts)
//Spanish
$('#TableName').DataTable({
"language": {
"sProcessing": "Procesando...",
"sLengthMenu": "Mostrar _MENU_ registros",
"sZeroRecords": "No se encontraron resultados",
"sEmptyTable": "Ningún dato disponible en esta tabla",
"sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
"sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
"sInfoFiltered": "(filtrado de un total de _MAX_ registros)",
"sInfoPostFix": "",
"sSearch": "Buscar:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Cargando...",
"oPaginate": {
"sFirst": "Primero",
"sLast": "Último",
"sNext": "Siguiente",
"sPrevious": "Anterior"
},
"oAria": {
"sSortAscending": ": Activar para ordenar la columna de manera ascendente",
"sSortDescending": ": Activar para ordenar la columna de manera descendente"
}
}
});
Also using a cdn:
//cdn.datatables.net/plug-ins/a5734b29083/i18n/Spanish.json
More options: http://www.datatables.net/plug-ins/i18n/English [| Spanish | etc]
for Arabic language
var table = $('#my_table')
.DataTable({
"columns":{//......}
"language":
{
"sProcessing": "???? ???????...",
"sLengthMenu": "???? _MENU_ ??????",
"sZeroRecords": "?? ???? ??? ??? ?????",
"sInfo": "????? _START_ ??? _END_ ?? ??? _TOTAL_ ????",
"sInfoEmpty": "???? 0 ??? 0 ?? ??? 0 ???",
"sInfoFiltered": "(?????? ?? ????? _MAX_ ?????)",
"sInfoPostFix": "",
"sSearch": "????:",
"sUrl": "",
"oPaginate": {
"sFirst": "?????",
"sPrevious": "??????",
"sNext": "??????",
"sLast": "??????"
}
}
});
Ref: https://datatables.net/plug-ins/i18n/Arabic
Author: Ossama Khayat
Source: Stackoverflow.com