Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Allowing user to select same day date using foundation datepicker

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 170
    Comment on it

    While using foundation datepicker we came across on issue while picking date for the same day i.e if today is 5th then user was not able to pick it from calender as it was disabled. The issue comes when you are in timezone that is in - of UTC :


    So in order to solve the issue we need to convert the user time in UTC by using the following code :

    var now = new Date(Date.UTC(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0));


    Thus once you use the above line of code foundation datepicker start working as expected for example :

    $('body').ready( function() {
          var old_fulladdr = $('.request-link').attr('href') ;
          var nowTemp = new Date();
          var now = new Date(Date.UTC(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0));
          $('.meal_date').fdatepicker({
          onRender: function (date) {
           return date.valueOf() < now.valueOf() ? 'disabled' : '';
          }
          }).on('changeDate', function (ev) {
            var newDate = new Date(ev.date);
            var minutes = newDate.getTimezoneOffset();
            newDate = new Date(newDate.getTime() + minutes*60000);
            var newDateUnix = newDate.getTime()/1000 ;
            var new_address = paramReplace('meal_date',old_fulladdr,newDateUnix)
            old_fulladdr = new_address;
            $('.request-link:visible').attr('href',new_address);
          });
    
          function paramReplace(name, string, value) {
            var re = new RegExp("[\\?&]" + name + "=([^&#]*)"),
            delimeter = re.exec(string)[0].charAt(0),
            newString = string.replace(re, delimeter + name + "=" + value);
            return newString;
          }
        });

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: