drkrol,
может документацию почитать? есть стандартная русификация и выбор формата даты: числами, именами полными или сокращёнными
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex, nofollow">
<script type="text/javascript" src="/js/lib/dummy.js"></script>
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://jquery-ui-bootstrap.github.io/jquery-ui-bootstrap/css/custom-theme/jquery-ui-1.10.3.custom.css">
<script type="text/javascript" src="https://rawgit.com/Artemeey/5ebc39370e568c34f03dce1639cabee8/raw/8de40b26479c406ee9cd6f9b4b3f4ad05370a024/jquery.datepicker.extension.range.min.js"></script>
<style type="text/css">
.ui-datepicker .selected-start:not(.selected-end) a,
.ui-datepicker .selected-end:not(.selected-start) a {
background: #F3FDD5;
}
.ui-datepicker .selected.first-of-month:not(.selected-start) a {
border-left: 2px dotted #D4E7F6;
padding-left: 1px;
}
.ui-datepicker .selected.last-of-month:not(.selected-end) a {
border-right: 2px dotted #D4E7F6;
padding-right: 1px;
}
</style>
<title>Jquery UI Datepicker - Period</title>
<script>
window.onload=function(){
$(function() {
$.datepicker.regional['ru'] = {
closeText: 'Закрыть',
prevText: '<Пред',
nextText: 'След>',
currentText: 'Сегодня',
monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн', 'Июл','Авг','Сен','Окт','Ноя','Дек'],
dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
dateFormat: 'dd.mm.yy',
firstDay: 1,
isRTL: false,
showOtherMonths:true,
selectOtherMonths:true,
changeMonth:true,
changeYear: false,
showAnim:'scale'
};
$.datepicker.setDefaults($.datepicker.regional["ru"]);
$('#date_range').datepicker({
range: 'period', // режим - выбор периода
numberOfMonths: 2,
onSelect: function(dateText, inst, extensionRange) {
// extensionRange - объект расширения
var string = jQuery.datepicker.formatDate('DD-MM-yy', extensionRange.startDate).split('-');
$('[name=startDate]').val(extensionRange.startDateText).nextUntil('[name=endDate]').val(function(i) {
return string[i]
});
string = jQuery.datepicker.formatDate('d-MM-yy', extensionRange.endDate).split('-');
$('[name=endDate]').val(extensionRange.endDateText).nextUntil('[name=endDate]').val(function(i) {
return string[i]
});
}
});
$('#date_range').datepicker('setDate', ['+4d', '+8d']);
// объект расширения (хранит состояние календаря)
var extensionRange = $('#date_range').datepicker('widget').data('datepickerExtensionRange');
if(extensionRange.startDateText) $('[name=startDate]').val(extensionRange.startDateText);
if(extensionRange.endDateText) $('[name=endDate]').val(extensionRange.endDateText);
});
}
</script>
</head>
<body>
Выберите период:
<br>
<br>
<div id="date_range"></div>
<br>
<input name="startDate">
<input type="text" value="День НЕДЕЛИ">
<input type="text" value="Месяц (словами)">
<input type="text" value="Год">
<input name="endDate">
<input type="text" value="День">
<input type="text" value="Месяц (словами)">
<input type="text" value="Год">
</body>
</html>