简体   繁体   中英

Customize Jquery UI Datepicker

I most likely suspect is not possible but I wanted to know If someone was has worked with customizing the calendar displayed on Jquery UI datepicker to the extend of changing the dates. Here is my situation: My company uses a fiscal year instead of a calendar year where and it begins on a different day each year, I actually made an excel calendar in the mean time and I could use the principle on javascript, my question is if there is a way to set up an initial date on the calendar and start counting weeks from that day...

Example

Fiscal year starts on August 28 (sunday), given that : AUG28-SEPT3 = FW1
SEPT4-SEPT10 = FW2
SEPT11-SEPT17 = FW3
.
.
.
and so on ... i want to show a calendar with the week number starting on AUG28 2011 (fw1) and ending on aug25 2012 (fw52).

i already read the documentation and I cant' find anything related, if I was not clear enough please let me know so I can rephrase.

You will have to create your own week calculation, see the docs for jQuery UI calculateWeek . Its a start, but not too helpful in those doc's. A little more useful was this blog post here .

Anyway here is the code I have managed to hack together, see the link below to see it working.

  • Define the datapicker:

     $("#mydatepicker").datepicker({ calculateWeek: fisc, maxDate: '08/25/12', minDate: '08/28/11', showWeek: true }); 

  • And the function to calculate the weeks:

     function fisc(date) { var checkDate = new Date(date.getTime()); checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7)); var time = checkDate.getTime(); checkDate.setMonth(7); checkDate.setDate(28); var week = (Math.floor(Math.round((time - checkDate) / 86400000) / 7) + 2); if (week < 1) { week = 52 + week; } return 'FW: '+week; } 

    Click here to see this in action

    I'm sure this probably isn't the perfect way to do this, but it seems to work for this time of night, hopefully it will point you in the correct direction.

  • Maybe you can try

    $('.dateinput').datepicker({
        dateFormat:'yy-mm-dd',
        duration: 'normal',
        changeMonth: true,
        changeYear: true,
        showWeek: true,
        /*other options goes here...*/
        calculateWeek: function(mydate){
            return 'FW'+(
                $.datepicker.iso8601Week(mydate + 1/*offset A*/)+1/*or offsetB*/
            );
        }
    });
    

    The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

     
    粤ICP备18138465号  © 2020-2024 STACKOOM.COM