web-dev-qa-db-fra.com

configuration de la langue dans Bootstrap Date Range Picker

J'utilise le Bootstrap Date Range Picker fourni et expliqué Dans cette page J'ai ajouté toute la bibliothèque en utilisant le cdn, je veux dire ceci:

<script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/latest/css/bootstrap.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />

Mais le fait est que j'ai besoin de tout en espagnol et je ne vois pas de code pour le configurer. Comment dois-je procéder?

twitter-bootstrap-3daterangepicker
17
Sredny M Casanova

Incluez l'option locale et modifiez les chaînes appropriées, comme fromLabel ou December:

$('#datePicker').daterangepicker({
    "locale": {
        "format": "MM/DD/YYYY",
        "separator": " - ",
        "applyLabel": "Apply",
        "cancelLabel": "Cancel",
        "fromLabel": "From",
        "toLabel": "To",
        "customRangeLabel": "Custom",
        "daysOfWeek": [
            "Su",
            "Mo",
            "Tu",
            "We",
            "Th",
            "Fr",
            "Sa"
        ],
        "monthNames": [
            "January",
            "February",
            "March",
            "April",
            "May",
            "June",
            "July",
            "August",
            "September",
            "October",
            "November",
            "December"
        ],
        "firstDay": 1
    }
})

voici une démo avec des noms de mois espagnols -> http://jsfiddle.net/r21747qc/

45
davidkonrad

Vous pouvez utiliser moment-with-locales.min.js au lieu de moment.min.js

<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment-with-locales.min.js"></script>

et définir la localisation avant d'initialiser daterangepicker

moment.locale('es');
$('#datePicker').daterangepicker();
29
Oleg

J'ai fait un exemple 'pt-br' basé sur le commentaire de @ davidkonrad

$('input[name="daterange"]').daterangepicker({
"locale": {
    "format": "DD/MM/YYYY",
    "separator": " - ",
    "applyLabel": "Aplicar",
    "cancelLabel": "Cancelar",
    "fromLabel": "De",
    "toLabel": "Até",
    "customRangeLabel": "Custom",
    "daysOfWeek": [
        "Dom",
        "Seg",
        "Ter",
        "Qua",
        "Qui",
        "Sex",
        "Sáb"
    ],
    "monthNames": [
        "Janeiro",
        "Fevereiro",
        "Março",
        "Abril",
        "Maio",
        "Junho",
        "Julho",
        "Agosto",
        "Setembro",
        "Outubro",
        "Novembro",
        "Dezembro"
    ],
    "firstDay": 0
}});

https://jsfiddle.net/joaopedroraldi/d7bmppga/55

2
João Pedro Raldi