Datepicker Translate

Jiwa
Offline
Last seen: 8 months 1 week ago
Tue, 12/06/2016 - 20:19
#1
Datepicker Translate

Good day!
Please tell me how can I change the language and date format in datepicker?

hattt13
Offline
Last seen: 1 day 5 hours ago
Wed, 12/07/2016 - 11:18

Hi Jiwa, you can change the language by include the localisation file, You may find other localisation files here: https://github.com/jquery/jquery-ui/tree/master/ui/i18n

Ex: 

<script src="https://jquery-ui.googlecode.com/svn-history/r3982/trunk/ui/i18n/jquery.ui.datepicker-nl.js"></script>

 Fi the code of datepicker jquery ui in file script.js.

Ex:

$.datepicker.setDefaults( $.datepicker.regional[ "nl" ] );
$('#date').datepicker({
numberOfMonths: 2,
showButtonPanel: true,
dateFormat : 'dd/mm/yy'
});

 dateFormat: date format in datepicker. you may refer to page http://api.jqueryui.com/datepicker/. Thanks

Jiwa
Offline
Last seen: 8 months 1 week ago
Wed, 12/07/2016 - 20:29

Thank!  But here is the code in file script.js, there's a connection between the dates (from - to), and it can be broken in such a way:

    /* Datepicker */
DatePicker();
function DatePicker() {
$( ".awe-calendar:not(.from, .to)" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
buttonImageOnly: false
});

/* Datepicker from - to */
$( ".awe-calendar.from" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
buttonImageOnly: false,
minDate:0,
onClose: function( selectedDate ) {
var newDate = new Date(selectedDate),
tomorrow = new Date(newDate.getTime() + 24 * 60 * 60 * 1000),
nextDate = (tomorrow.getMonth()+1)+'/'+tomorrow.getDate()+'/'+tomorrow.getFullYear();
$( ".awe-calendar.to" ).datepicker("option","minDate",nextDate).focus();
}
});
$( ".awe-calendar.to" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
buttonImageOnly: false,
minDate:0,
onClose: function( selectedDate ) {
//$(".awe-calendar.from").datepicker( "option", "maxDate", selectedDate );
}
});
}

 I need RU translation and dd/mm/yy format. Thanks!

hattt13
Offline
Last seen: 1 day 5 hours ago
Mon, 12/12/2016 - 11:06

Hi there.

1. Format Date: You can find function DatePicker replace with the code: 

function DatePicker() {
$.datepicker.setDefaults( $.datepicker.regional[ "ru" ] );


$( ".awe-calendar:not(.from, .to)" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
buttonImageOnly: false
});

/* Datepicker from - to */
$( ".awe-calendar.from" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
dateFormat : 'dd/mm/yy',
buttonImageOnly: false,
minDate:0,
onClose: function( selectedDate ) {
var newDate = new Date(selectedDate),
tomorrow = new Date(newDate.getTime() + 24 * 60 * 60 * 1000),
nextDate = (tomorrow.getMonth()+1)+'/'+tomorrow.getDate()+'/'+tomorrow.getFullYear();
$( ".awe-calendar.to" ).datepicker("option","minDate",nextDate).focus();
}
});
$( ".awe-calendar.to" ).datepicker({
prevText: '<i class="hillter-icon-left-arrow"></i>',
nextText: '<i class="hillter-icon-right-arrow"></i>',
dateFormat : 'dd/mm/yy',
buttonImageOnly: false,
minDate:0,
onClose: function( selectedDate ) {
//$(".awe-calendar.from").datepicker( "option", "maxDate", selectedDate );
}
});
}

2. RU translation: i sent to you file datepicker-ru.js, you  can be saved to folder lib in hillter\js\lib and add link The bottom of the html file. Thanks 

<script type="text/javascript" src="js/lib/datepicker-ru.js"></script>

hattt13
Offline
Last seen: 1 day 5 hours ago
Mon, 12/12/2016 - 12:03
Jiwa
Offline
Last seen: 8 months 1 week ago
Tue, 12/13/2016 - 13:29

Thank you very much for your support, but there is another problem ... I did everything according to the instructions. But now when I choosing a date of arrival  "January 2, 2017" - the date of departure begins with "2 February 2017" / if you choose the date of arrival "23 January 2017" - the date of departure begins today... and so on. 

Jiwa
Offline
Last seen: 8 months 1 week ago
Tue, 12/13/2016 - 15:39

Thank you! I found the solution!

Just removed "var newDate" and replaced on "selectedDate" !

Hillter is my favorite template :)

Log in or register to post comments