Jquery Question posted in
The official Jquery Api Documentation can be found here.

Set JQuery Datepicker Time to Pacific Time

I am using the following code for my date picker based on (Accounting for Timezone with jQuery datepicker) but i can’t figure out where the timezone code goes.

<script type="text/javascript">
$(document).ready(function() {

    //holidays
    var natDays = [
      [1, 1, 'New Year'], //2014
      [1, 20, 'Martin Luther King'], //2014
      [2, 17, 'Washingtons Birthday'], //2014       
      [5, 26, 'Memorial Day'], //2014
      [7, 4, 'Independence Day'], //2014
      [9, 1, 'Labour Day'], //2014
      [10, 14, 'Columbus Day'], //2013
      [11, 11, 'Veterans Day'], //2013
      [11, 28, 'Thanks Giving Day'], //2013 
      [12, 25, 'Christmas'] //2013     
 ];

    var dateMin = new Date();
    dateMin.setDate(dateMin.getDate() + (dateMin.getHours() >= 14 ? 1 : 0));
    AddBusinessDays(dateMin, 4);

    function AddBusinessDays(curdate, weekDaysToAdd) {
        while (weekDaysToAdd > 0) {
            curdate.setDate(curdate.getDate() + 1);
            //check if current day is business day
            if (noWeekendsOrHolidays(curdate)[0]) {
                weekDaysToAdd--;
            }
        }
    }    

    function noWeekendsOrHolidays(date) {
        var noWeekend = $.datepicker.noWeekends(date);
        if (noWeekend[0]) {
            return nationalDays(date);
        } else {
            return noWeekend;
        }
    }
    function nationalDays(date) {
        for (i = 0; i < natDays.length; i++) {
            if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) {
                 return [false, natDays[i][2] + '_day'];
            }
        }
        return [true, ''];
    }
      $('#datepicker').datepicker({ 
            inline: true,
            beforeShowDay: noWeekendsOrHolidays,           
            showOn: "both",            
            firstDay: 0,
            dateformat: "dd/mm/yy",
            changeFirstDay: false,
            showButtonPanel: true,       
            minDate: dateMin            
    });
  });
  </script>

It works great except for one issue. I can’ t figure out how to set the timezone to PST. I don t know anything about code and could use some help please.

I want the available date to be based on Pacific Time regardless of where the user is at.

Thank you for your time and help

I looked at different threads but i got even more confused such as

text

Tags:

2

Answers


  1. 0

    You’ll need to convert the current date to Pacific Time. JavaScript’s Date object can help you with timezone offsets.

    The utcOffset is derived using getTimezoneOffset(), which gives you the difference in minutes from UTC.pstOffset is set to -8 hours, representing Pacific Standard Time.

    You modify dateMin by converting the current date to PST using both offsets. This ensures that the date picker will be set to the correct minimum date based on PST.

    Login or Signup to reply.
  2. 0 
    <script type="text/javascript">
$(document).ready(function() {

    var natDays = [
      [1, 1, 'New Year'],
      [1, 20, 'Martin Luther King'],
      [2, 17, 'Washingtons Birthday'],     
      [5, 26, 'Memorial Day'],
      [7, 4, 'Independence Day'],
      [9, 1, 'Labour Day'],
      [10, 14, 'Columbus Day'],
      [11, 11, 'Veterans Day'],
      [11, 28, 'Thanks Giving Day'], 
      [12, 25, 'Christmas']
    ];

    function getPSTDate() {
        var now = new Date();
        var pstTime = now.toLocaleString('en-US', { timeZone: 'America/Los_Angeles' });
        return new Date(pstTime);
    }

    var dateMin = getPSTDate();
    dateMin.setDate(dateMin.getDate() + (dateMin.getHours() >= 14 ? 1 : 0));

    AddBusinessDays(dateMin, 4);

    function AddBusinessDays(curdate, weekDaysToAdd) {
        while (weekDaysToAdd > 0) {
            curdate.setDate(curdate.getDate() + 1);
            if (noWeekendsOrHolidays(curdate)[0]) {
                weekDaysToAdd--;
            }
        }
    }    

    function noWeekendsOrHolidays(date) {
        var noWeekend = $.datepicker.noWeekends(date);
        if (noWeekend[0]) {
            return nationalDays(date);
        } else {
            return noWeekend;
        }
    }

    function nationalDays(date) {
        for (i = 0; i < natDays.length; i++) {
            if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) {
                 return [false, natDays[i][2] + '_day'];
            }
        }
        return [true, ''];
    }

    $('#datepicker').datepicker({ 
        inline: true,
        beforeShowDay: noWeekendsOrHolidays,           
        showOn: "both",            
        firstDay: 0,
        dateFormat: "dd/mm/yy",
        changeFirstDay: false,
        showButtonPanel: true,       
        minDate: dateMin            
    });
});
</script>

    try this code, I think this helps you. If helps please Upvote the answer, Happy Coding.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search