Translate editor modal

Translate editor modal

cmpluscmplus Posts: 65Questions: 13Answers: 0

How do I translate file addition entries in the modal window? for example No file, Drag and drop a file here to upload

This question has an accepted answers - jump to answer

Answers

  • rf1234rf1234 Posts: 3,021Questions: 88Answers: 421
    edited January 15

    You are referring to the file upload text only. Hence I would recommend you take a look at the docs:
    https://editor.datatables.net/reference/field/uploadMany
    You can specify various texts as you can see there. These can of course be in any language.

    My solution for this:

    var dragDropText;
    var uploadText;
    var noFileText;
    var processingText;
    var fileReadText;
    if (lang === 'de') {
        dragDropText = 'Drag und Drop zum Hochladen';
        uploadText = 'Dokument auswählen ...';
        noFileText = 'Keine Dokumente';
        processingText = 'Verarbeitung läuft ...';
        fileReadText = 'Dokument wird hochgeladen';
    } else {
        dragDropText = 'Drag and Drop to Upload';
        uploadText = 'Choose Document ...';
        noFileText = 'No Documents';
        processingText = 'Processing ...';
        fileReadText = 'Uploading Document';
    }
    ....
    }, {    
        label: lang === 'de' ? 'Dokumentation:' : 'Documentation:',
        name: "file[].id",
        type: "uploadMany",
        display: function ( fileId, counter ) {
            var fileNameExt = ctrEditor.file( 'file', fileId ).name;
            var softDeleted = ctrEditor.file( 'file', fileId ).soft_deleted;
            return renderFilesEditor(fileNameExt, softDeleted);
        },
        dragDropText: dragDropText,
        uploadText:   uploadText,
        noFileText:   noFileText,
        processingText: processingText,
        fileReadText: fileReadText
    }, {
    

    And more Editor translations in case the user language is German and not English. For English I stick to the built-in defaults.

    if (lang === 'de') {
        $.extend( true, $.fn.dataTable.Editor.defaults, {            
            i18n: {
                remove: {
                    button: "Löschen",
                    title:  "Eintrag löschen",
                    submit: "Endgültig Löschen",
                    confirm: {
                        _: 'Sind Sie sicher, dass Sie die %d ausgewählten Zeilen löschen wollen?',
                        1: 'Sind Sie sicher, dass Sie die ausgewählte Zeile löschen wollen?'
                    }
                },
                edit: {
                    button: "Bearbeiten",
                    title:  "Eintrag bearbeiten",
                    submit: "Änderungen speichern"
                },
                create: {
                    button: "Neuer Eintrag",
                    title:  "Neuen Eintrag anlegen",
                    submit: "Neuen Eintrag speichern"
                },
                datetime: {
                        previous: 'Zurück',
                        next:     'Weiter',
                        months:   [ 'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember' ],
                        weekdays: [ 'So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa' ],
                        amPm:     [ 'am', 'pm' ],
                        hours:    'Stunde',
                        minutes:  'Minute',
                        seconds:  'Sekunde',
                        unknown:  '-'
                },
                error: {
                        system: "Ein Systemfehler ist aufgetreten (<a target=\"_blank\" href=\"//datatables.net/tn/12\">Für mehr Informationen</a>)."
                },
                multi: {
                        title: "Mehrere Werte",         
                        info: "Die ausgewählten Zeilen enthalten verschiedene Werte für dieses Feld. Um alle Zeilen auf den gleichen Wert zu setzen, \n\
                               klicken Sie bitte hier. Ansonsten werden die Zeilen ihren individuellen Wert für das Feld behalten.",
                        restore: "Änderungen rückgängig machen",
                        noMulti: "Dieses Feld kann einzeln bearbeitet werden, aber nicht als Teil einer Gruppe."
                }
            }      
        });
    }
    
  • cmpluscmplus Posts: 65Questions: 13Answers: 0
    edited January 15

    @rf1234 Thanks for the reply, I inserted the entries in the language file which currently translates everything for me but it doesn't translate those entries for me, and it doesn't work, I tried with your suggestion and it doesn't translate, they remain in English

        "editor": {
            "close": "Chiudi",
            "create": {
                "button": "Nuovo",
                "submit": "Aggiungi",
                "title": "Aggiungi nuovo elemento"
            },
            "edit": {
                "button": "Modifica",
                "submit": "Modifica",
                "title": "Modifica elemento"
            },
            "error": {
                "system": "Errore del sistema."
            },
            "multi": {
                "info": "Gli elementi selezionati contengono valori diversi. Per modificare e impostare tutti gli elementi per questa selezione allo stesso valore, premi o clicca qui, altrimenti ogni cella manterrà il suo valore attuale.",
                "noMulti": "Questa selezione può essere modificata individualmente, ma non se fa parte di un gruppo.",
                "restore": "Annulla le modifiche",
                "title": "Valori multipli",
                "dragDropText": "Trascina e rilascia un file qui per caricarlo",
                "uploadText": "Scegli documento...",
                "noFileText": "Nessun documento",
                "processingText": "In lavorazione ...",
                "fileReadText": "Caricamento documento"
            },
            "remove": {
                "button": "Rimuovi",
                "confirm": {
                    "_": "Sei sicuro di voler cancellare %d righe?",
                    "1": "Sei sicuro di voler cancellare 1 riga?"
                },
                "submit": "Rimuovi",
                "title": "Rimuovi"
            }
        },
    
  • rf1234rf1234 Posts: 3,021Questions: 88Answers: 421

    I don't see you updating the Editor defaults and "i18n". You need to do this:

    $.extend( true, $.fn.dataTable.Editor.defaults, {           
            i18n: { ...
    

    Take a close look at what I posted please.

    This will probably not work: no reference to the Editor defaults and no reference to "i18n" either.

    "editor": {
        "close": "Chiudi",
    
  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin

    I think there is actually a gap in the support for the language information from a file here. The upload field type gets it's translation settings from its configuration object as rf1234 showed. It did not currently have an option to take the translations from the main i18n object, which in retrospect is a flaw. Apologies, that is something I'll need to add in.

    Allan

  • cmpluscmplus Posts: 65Questions: 13Answers: 0
    edited January 15

    where should I add that string?

    Is it likely that it doesn't work because I use yajra datatables with the editor?, currently I have everything translated correctly, that's all I'm missing, the items that are in the upload I don't understand the problem

    {
        "infoFiltered": "(filtrati da _MAX_ elementi totali)",
        "infoThousands": ".",
        "loadingRecords": "Caricamento...",
        "processing": "Elaborazione...",
        "search": "Cerca:",
        "paginate": {
            "first": "Inizio",
            "previous": "Precedente",
            "next": "Successivo",
            "last": "Fine"
        },
        "aria": {
            "sortAscending": ": attiva per ordinare la colonna in ordine crescente",
            "sortDescending": ": attiva per ordinare la colonna in ordine decrescente"
        },
        "autoFill": {
            "cancel": "Annulla",
            "fill": "Riempi tutte le celle con <i>%d<\/i>",
            "fillHorizontal": "Riempi celle orizzontalmente",
            "fillVertical": "Riempi celle verticalmente"
        },
        "buttons": {
            "collection": "Collezione <span class=\"ui-button-icon-primary ui-icon ui-icon-triangle-1-s\"><\/span>",
            "colvis": "Visibilità Colonna",
            "colvisRestore": "Ripristina visibilità",
            "copy": "Copia",
            "copyKeys": "Premi ctrl o u2318 + C per copiare i dati della tabella nella tua clipboard di sistema.<br \/><br \/>Per annullare, clicca questo messaggio o premi ESC.",
            "copySuccess": {
                "1": "Copiata 1 riga nella clipboard",
                "_": "Copiate %d righe nella clipboard"
            },
            "copyTitle": "Copia nella Clipboard",
            "csv": "CSV",
            "excel": "Excel",
            "pageLength": {
                "-1": "Mostra tutte le righe",
                "_": "Mostra %d righe"
            },
            "pdf": "PDF",
            "print": "Stampa",
            "createState": "Crea stato",
            "removeAllStates": "Rimuovi tutti gli stati",
            "removeState": "Rimuovi",
            "renameState": "Rinomina",
            "savedStates": "Salva stato",
            "stateRestore": "Ripristina stato",
            "updateState": "Aggiorna"
        },
        "emptyTable": "Nessun dato disponibile nella tabella",
        "info": "Risultati da _START_ a _END_ di _TOTAL_ elementi",
        "infoEmpty": "Risultati da 0 a 0 di 0 elementi",
        "lengthMenu": "Mostra _MENU_ elementi",
        "searchBuilder": {
            "add": "Aggiungi Condizione",
            "button": {
                "0": "Generatore di Ricerca",
                "_": "Generatori di Ricerca (%d)"
            },
            "clearAll": "Pulisci Tutto",
            "condition": "Condizione",
            "conditions": {
                "date": {
                    "after": "Dopo",
                    "before": "Prima",
                    "between": "Tra",
                    "empty": "Vuoto",
                    "equals": "Uguale A",
                    "not": "Non",
                    "notBetween": "Non Tra",
                    "notEmpty": "Non Vuoto"
                },
                "number": {
                    "between": "Tra",
                    "empty": "Vuoto",
                    "equals": "Uguale A",
                    "gt": "Maggiore Di",
                    "gte": "Maggiore O Uguale A",
                    "lt": "Minore Di",
                    "lte": "Minore O Uguale A",
                    "not": "Non",
                    "notBetween": "Non Tra",
                    "notEmpty": "Non Vuoto"
                },
                "string": {
                    "contains": "Contiene",
                    "empty": "Vuoto",
                    "endsWith": "Finisce Con",
                    "equals": "Uguale A",
                    "not": "Non",
                    "notEmpty": "Non Vuoto",
                    "startsWith": "Inizia Con",
                    "notContains": "Non Contiene",
                    "notStartsWith": "Non Inizia Con",
                    "notEndsWith": "Non Finisce Con"
                },
                "array": {
                    "equals": "Uguale A",
                    "empty": "Vuoto",
                    "contains": "Contiene",
                    "not": "Non",
                    "notEmpty": "Non Vuoto",
                    "without": "Senza"
                }
            },
            "data": "Dati",
            "deleteTitle": "Elimina regola filtro",
            "leftTitle": "Criterio di Riduzione Rientro",
            "logicAnd": "E",
            "logicOr": "O",
            "rightTitle": "Criterio di Aumento Rientro",
            "title": {
                "0": "Generatore di Ricerca",
                "_": "Generatori di Ricerca (%d)"
            },
            "value": "Valore"
        },
        "searchPanes": {
            "clearMessage": "Pulisci Tutto",
            "collapse": {
                "0": "Pannello di Ricerca",
                "_": "Pannelli di Ricerca (%d)"
            },
            "count": "{total}",
            "countFiltered": "{shown} ({total})",
            "emptyPanes": "Nessun Pannello di Ricerca",
            "loadMessage": "Caricamento Pannello di Ricerca",
            "title": "Filtri Attivi - %d",
            "showMessage": "Mostra tutto",
            "collapseMessage": "Espandi tutto"
        },
        "select": {
            "cells": {
                "1": "1 cella selezionata",
                "_": "%d celle selezionate"
            },
            "columns": {
                "1": "1 colonna selezionata",
                "_": "%d colonne selezionate"
            },
            "rows": {
                "1": "1 riga selezionata",
                "_": "%d righe selezionate"
            }
        },
        "zeroRecords": "Nessun elemento corrispondente trovato",
        "datetime": {
            "amPm": [
                "am",
                "pm"
            ],
            "hours": "ore",
            "minutes": "minuti",
            "next": "successivo",
            "previous": "precedente",
            "seconds": "secondi",
            "unknown": "sconosciuto",
            "weekdays": [
                "Dom",
                "Lun",
                "Mar",
                "Mer",
                "Gio",
                "Ven",
                "Sab"
            ],
            "months": [
                "Gennaio",
                "Febbraio",
                "Marzo",
                "Aprile",
                "Maggio",
                "Giugno",
                "Luglio",
                "Agosto",
                "Settembre",
                "Ottobre",
                "Novembre",
                "Dicembre"
            ]
        },
        "editor": {
            "close": "Chiudi",
            "create": {
                "button": "Nuovo",
                "submit": "Aggiungi",
                "title": "Aggiungi nuovo elemento"
            },
            "edit": {
                "button": "Modifica",
                "submit": "Modifica",
                "title": "Modifica elemento"
            },
            "error": {
                "system": "Errore del sistema."
            },
            "multi": {
                "info": "Gli elementi selezionati contengono valori diversi. Per modificare e impostare tutti gli elementi per questa selezione allo stesso valore, premi o clicca qui, altrimenti ogni cella manterrà il suo valore attuale.",
                "noMulti": "Questa selezione può essere modificata individualmente, ma non se fa parte di un gruppo.",
                "restore": "Annulla le modifiche",
                "title": "Valori multipli",
                "dragDropText": "Trascina e rilascia un file qui per caricarlo",
                "uploadText": "Scegli documento...",
                "noFileText": "Nessun documento",
                "processingText": "In lavorazione ...",
                "fileReadText": "Caricamento documento"
            },
            "remove": {
                "button": "Rimuovi",
                "confirm": {
                    "_": "Sei sicuro di voler cancellare %d righe?",
                    "1": "Sei sicuro di voler cancellare 1 riga?"
                },
                "submit": "Rimuovi",
                "title": "Rimuovi"
            }
        },
        "thousands": ".",
        "decimal": ",",
        "stateRestore": {
            "creationModal": {
                "button": "Crea",
                "columns": {
                    "search": "Colonna Cerca",
                    "visible": "Colonna Visibilità"
                },
                "name": "Nome:",
                "order": "Ordinamento",
                "paging": "Paginazione",
                "scroller": "Scorri posizione",
                "search": "Ricerca",
                "searchBuilder": "Form di Ricerca",
                "select": "Seleziona",
                "title": "Crea nuovo Stato",
                "toggleLabel": "Includi:"
            },
            "duplicateError": "Nome stato già presente",
            "emptyError": "Il nome è obbligatorio",
            "emptyStates": "Non ci sono stati salvati",
            "removeConfirm": "Sei sicuro di eliminare lo Stato %s?",
            "removeError": "Errore durante l'eliminazione dello Stato",
            "removeJoiner": "e",
            "removeSubmit": "Elimina",
            "removeTitle": "Elimina Stato",
            "renameButton": "Rinomina",
            "renameLabel": "Nuovo nome per %s:",
            "renameTitle": "Rinomina Stato"
        }
    }
    

    and I recall the translation with

                ->parameters([
                    'dom' => 'Bfrtip',
                    'language' => ['url' => url('vendors/it-IT.json')],
                ]);
    
  • rf1234rf1234 Posts: 3,021Questions: 88Answers: 421

    "language" is DataTables. Editor wants "i18n".

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin
    Answer ✓

    You need to put the translation for the upload into the field's configuration object.

    fields: [
            {
                label: 'Image:',
                name: 'image',
                type: 'upload',
                display: (fileId) =>
                    `<img src="${editor.file('files', fileId).web_path}"/>`,
                clearText: 'Clear',
                noImageText: 'No image',
                // etc
            }
    }
    

    In the above I've got the strings for clearText and noImageText set. As rf1234 pointed out, there are other string options for upload which can be set as well.

    Allan

  • cmpluscmplus Posts: 65Questions: 13Answers: 0

    @allan Thank you

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin

    Following up on this one - with Editor 2.4 (which will be released soon) it will be possible to use a new i18n.field.upload object (and i18n.field.uploadMany) to set default values for the translation strings used by the fields.

    The upshot is that the language file will now be able to include the strings for those field types, while still allowing the option of overriding them per field.

    Allan

Sign In or Register to comment.