The GWT-Ext Date-Picker widget (the Calendar widget that allows for selection of a date) by default shows the starting day of a week as Sunday. Moreover, there is no API provided to change it to any other day. E.g. in one of the financial applications that I was recently working on, users wanted that the start of week as Monday as they transact business from Monday thru Friday.
However, there is a very simple way to fix this problem. As GWT-Ext uses Ext components internally, we just need to modify the ext-all.js to set the start day as Monday (or any other day). The only drawback of this solution is that it will change the start of week for all instances of the Date-Picker widget used in the application.
Follow these steps to change the start of week:
1. Open ext-all.js in any text-editor (e.g. WordPad). This file would be present in the public/js/ext folder of your project as shown in the screenshot below:
2. Within the file search for the text “Ext.DatePicker“. This line contains all the default properties for the Date-Picker widget. The properties are comma-separated.
3. Keep scrolling to the right till you find the property “startDay“. If you have never modified the file before, it should have the value set as “0” (zero). The assignment would look like this:
The days of a week are defined using the following integers: Sunday – 0, Monday -1, Tuesday-2,…,Saturday-6.
4. Set the value of startDay to your desired value. E.g. in my case, I wanted the week to start from Monday, so I set it to 1.
5. Save the changes and redeploy the updated JS file on your Web Server.
6. Restart the application.
You will now find that the start-day has changed to whatever day you had set in the ext-all.js file.