Hi,
On Apex 5.0.3 I have a calendar region that was working fine..
On a regular Calendar the weeks show as Sunday to Saturday
I had to change the application locale of it to "es" to make the months and days of week show in Spanish.
As per calendar.io documentation firstDay = 0 (sunday) by default.
Now that a new locale is loaded the new firstDay is set to 1 (Monday) so the weeks show as Monday to Sunday.
The requirement I have is to keep it with the locale set to "es" but the weeks must show Sunday to Saturday.
So I have been trying to run the following code on the "Execute when Page Loads" of the page that holds the calendar region, the result has been unsuccessful, that is the calendar still shows the Monday as first day of the week.
$("#teamcalendar_calendar").fullCalendar("firstDay: 0");
and
$("#teamcalendar_calendar").fullCalendar("firstDayOfWeek: 0"); /* APEX seems to invoke the method with that attribute name, see below */
While debugging in Chrome I see that APEX Generated the following code generated by APEX, as you can see highlighted in Red below, APEX generated the call to create the calendar with the firstDayOfWeek = 1 (which is Monday):
</script>
<script type="text/javascript" src="/i/libraries/apex/minified/widget.treeView.min.js?v=5.0.3.00.03"></script>
<script type="text/javascript" src="/i/libraries/jquery-fullcalendar/2.2.3/lib/moment.min.js?v=5.0.3.00.03"></script>
<script type="text/javascript" src="/i/libraries/jquery-fullcalendar/2.2.3/js/fullcalendarlist.min.js?v=5.0.3.00.03"></script>
<script type="text/javascript" src="/i/libraries/jquery-fullcalendar/2.2.3/lang/es-mx.js?v=5.0.3.00.03"></script>
<script type="text/javascript" src="/i/libraries/apex/minified/widget.cssCalendar.min.js?v=5.0.3.00.03"></script>
<script type="text/javascript" src="/i/apex_ui/js/minified/devToolbar.min.js?v=5.0.3.00.03"></script>
<script type="text/javascript">
apex.jQuery( document ).ready( function() {
(function(){$('body').addClass('t-PageBody--leftNav');
})();
(function(){apex.widget.cssCalendar("teamcalendar",{"isMobile":false,"enableDragAndDrop":true,"editLink":"javascript:apex.navigation.dialog(\u0027f?p=120:7:15929279464746::NO:RP,7:P7_ID:\u005Cu00255C\u005Cu00255C\u005Cu0026cs=3WPCzTtvDQmAUWIrY1fPpTXOkmGM\u005Cu0026p_dialog_cs=W0KeNFaVVG4j1lmuPUBbZUyHil4\u0027,{title:\u0027DCS-Calendario - Modificar Trabajo\u0027,height:\u0027550\u0027,width:\u0027750\u0027,maxWidth:\u0027960\u0027,modal:true,dialog:null,resizable:true, open: function( event, ui ) { closeDialogClickOutside(this); }},\u0027t-Dialog--standard\u0027,apex.jQuery(\u0027#teamcalendar_calendar\u0027));","createLink":"javascript:apex.navigation.dialog(\u0027f?p=120:6:15929279464746::NO:RP,6:P6_START_DATE,P6_END_DATE:\u005Cu00255C~APEX_NEW_START_DATE~\u005Cu00255C,\u005Cu00255C~APEX_NEW_END_DATE~\u005Cu00255C\u005Cu0026p_dialog_cs=BVV-Hj4XvMgspbxqWDp6hRnlRJ0\u0027,{title:\u0027DCS-Calendario - Nuevo Trabajo\u0027,height:\u0027550\u0027,width:\u0027720\u0027,maxWidth:\u0027960\u0027,modal:true,dialog:null,resizable:true, open: function( event, ui ) { closeDialogClickOutside(this); }},\u0027t-Dialog--standard\u0027,apex.jQuery(\u0027#teamcalendar_calendar\u0027));","sendInvitation":false,"enableResizing":true,"calendarHeader":"{\u0022left\u0022:\u0022prev,next today\u0022,\u0022center\u0022:\u0022title\u0022,\u0022right\u0022:\u0022month,list\u0022}","weekEnds":true,"mouseHoverOver":false,"eventLimit":"15","appDateFormat":"DD-MMM-YYYY","firstDayOfWeek":"1","escapeOutput":true,"ajaxIdentifier":"A8620D3C496041D1FCB668BDBC243620BCC479D9F999DBB13039AC9964A8F987"},"es-mx");})();
(function(){apex.initDevToolbar([{"pageId":"5","typeId":"5110","id":"41207624517925918","domId":"teamcalendar"},{"pageId":"5","typeId":"5130","id":"37327705967934449","domId":"refreshbutton"}],"FOCUS",{"autoHide":"Auto Hide","iconsOnly":"Show Icons Only","noBuilderMessage":"This application was not run from the Application Express Application Builder or the Builder window cannot be found. The Builder will now replace the application in this window.","display":"Display Position","displayTop":"Top","displayLeft":"Left","displayBottom":"Bottom","displayRight":"Right"},42);})();
(function(){apex.da.initDaEventList();})();
(function(){apex.da.init();})();
apex.theme42.initializePage.noSideCol();
$("#teamcalendar_calendar").fullCalendar("firstDay: 0");
$("#teamcalendar_calendar").fullCalendar("firstDayOfWeek: 0");
</script>
</body>
</html>
The question is how to make the calendar show Sunday as the first day of the week?
Seems to me the calendar can't change once created.. it needs to be part of the specification..
Any clues???
Thanks in advance.
-G