Question

This line is on top of my JavaScript and executed:

jQuery(function($) {
    $.datepicker.setDefaults($.datepicker.regional['de']);
});

I initialize my calendar in the same file inside the document-ready function:

// #transports-calendar is a div
$("#transports-calendar").datepicker({
    onSelect: function() {
        // Some stuff
    }
});

On my HTML page the following scripts are included:

<script src="/Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui.js" type="text/javascript"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.dialogextend.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.blockUI.js" type="text/javascript"></script>        
<script src="/Scripts/jquery-ui-timepicker-addon.js" type="text/javascript"></script>            
<script src="/Scripts/tooltip.js" type="text/javascript"></script>
<script src="/Scripts/tooltip.dynamic.js" type="text/javascript"></script>
<script src="/Scripts/tooltip.slide.js" type="text/javascript"></script>
<script src="/Scripts/core.js" type="text/javascript"></script>
<script src="/Scripts/core-functionality.js" type="text/javascript"></script>   
<script src="/Scripts/core-extensions.js" type="text/javascript"></script>  
<script src="/ModuleScripts/jquery.ui.datepicker-de.js" type="text/javascript"></script>

Everything is okay, but as mentioned in the title, the DatePicker is only translated when it is clicked.

Answer 1

Something that might be worth a try is to apply the regional settings when you call the datepicker function like so:

$("#transports-calendar").datepicker(
    $.datepicker.regional['de']
);

Then set the onselect event like so…

$("#transports-calendar").datepicker("option", "onSelect", function (date) {
   // Some stuff
});