Localization of the datepicker

There is a code from https://jqueryui.com/datepicker/#date-range I added the settings for the Russian language to it$. datepicker. setDefaults, but the calendar stopped working (the drop-down list disappeared).

What did I do wrong? Here is the code:

<?php
function datepicker_js(){
?>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>

        $( function() {
        //Сменим язык календаря на русский
            $.datepicker.setDefaults(
                {
                closeText: 'Закрыть',
                prevText: '',
                currentText: 'Сегодня',
                monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь',
                    'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
                monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн',
                    'Июл','Авг','Сен','Окт','Ноя','Дек'],
                dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
                dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
                dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
                weekHeader: 'Не',
                dateFormat: 'dd.mm.yy',
                firstDay: 1,
                isRTL: false,
                showMonthAfterYear: false,
                yearSuffix: ''
            };
            //Добавим код календаря
            var dateFormat = "mm/dd/yy",
                from = $( "#ps_second_input_from" )
                    .datepicker({
                        defaultDate: "+1w",
                        changeMonth: true,
                        numberOfMonths: 1
                    })
                    .on( "change", function() {
                        to.datepicker( "option", "minDate", getDate( this ) );
                    }),
                to = $( "#ps_second_input_to" ).datepicker({
                    defaultDate: "+1w",
                    changeMonth: true,
                    numberOfMonths: 1
                })
                    .on( "change", function() {
                        from.datepicker( "option", "maxDate", getDate( this ) );
                    });

            function getDate( element ) {
                var date;
                try {
                    date = $.datepicker.parseDate( dateFormat, element.value );
                } catch( error ) {
                    date = null;
                }

                return date;
            }
        } );
    </script>

    <?php

}
Author: Kromster, 2017-02-05

3 answers

I think that's what you need, load the file as it is: https://github.com/jquery/jquery-ui/blob/master/ui/i18n/datepicker-ru.js

 4
Author: L. Vadim, 2017-02-05 09:10:58

Have you tried it like this?

$('.datepicker').datepicker({
	dateFormat : "yy-mm-dd",
	minDate: new Date($('#hiddendelivdate').val()),
	monthNames : ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
	dayNamesMin : ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
});
 2
Author: misha11, 2017-04-28 13:04:20

You have a syntax error, in your example

showMonthAfterYear: false,
                yearSuffix: ''
            };
            //Добавим код календаря

You forgot to insert the closing parenthesis }); it should be like this:

 showMonthAfterYear: false,
                    yearSuffix: ''
                });
                //Добавим код календаря

When working with JS code, always watch for errors in the console. Your code can be optimized, try this:

var dateToday = new Date(); 
    $.datepicker.regional['ru'] = {
                    closeText: 'Закрыть',
                    prevText: 'Пред',
                    nextText: 'След',
                    currentText: 'Сегодня',
                    monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь',
                    'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
                    monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн',
                    'Июл','Авг','Сен','Окт','Ноя','Дек'],
                    dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
                    dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
                    dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
                    weekHeader: 'Нед',
                    dateFormat: 'dd.mm.yy',
                    firstDay: 1,
                    isRTL: false,
                    showMonthAfterYear: false,
                    yearSuffix: ''};
            $.datepicker.setDefaults($.datepicker.regional['ru']);  

            $('#ps_second_input_from').datepicker({
                changeMonth: true,
                changeYear: true,
            maxDate: dateToday,
            onSelect: function( selectedDate ) {
                $( "#ps_second_input_to" ).datepicker( "option", "minDate", selectedDate );
            },
                });



            $('#ps_second_input_to').datepicker({
                changeMonth: true,
                changeYear: true,
            maxDate: dateToday,
            minDate: minDate,
            onSelect: function( selectedDate ) {
                $( "#ps_second_input_from" ).datepicker( "option", "maxDate",  selectedDate );
            },
                }); 
 0
Author: Arsen, 2017-02-05 09:25:59