Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to fake current date for jquery-ui-datepicker

I'm implementing a custom algorithm to disable dates depending on a set of rules that also depend on what the current day is. To test that I would need to set the current date to a specific date.

I found this thread that just overwrites javascripts Date function. My problem is that if I do that the calendar doesn't work as expected anymore. Most of the time all days are just missing, sometimes all are disabled.

var oldDate = Date;
Date = function (fake)
{
    if( ! fake ) return new oldDate('02/26/2017');

    return new oldDate(fake);
}
Date.prototype = oldDate.prototype;

How can I test the datepicker with a custom current date? It should be as easy as setting up a jsfiddle (if possible): My current Fiddle

like image 762
steros Avatar asked Dec 07 '25 08:12

steros


1 Answers

I'm not so sure about what you need to do, I usually change operating system time, anyway, plain an simple:

  
// DEMO mock date js browser
// comment uncoment to play arround, if you need to automate with or without mock date plain an simple:
mockDateTime('2018/02/02'); // with mock
// mockDateTime() // no mock


$('#date1').datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: "m/d/yy"
});

function mockDateTime(mockDate){
   // to do: validate mock date
   if (mockDate !== undefined && mockDate.length > 0)
   {
     var __Date = Date;
     Date = undefined;
     Date = function()
     {
          // to do: more deep checks on arguments          
          if (arguments.length > 0)
          {
              return new __Date(arguments[0], arguments[1], arguments[2]);
          }
          return new __Date(mockDate);
     };
     Date.prototype = __Date.prototype;
   }
}
#ui-datepicker-div { font-size: 12px; } 
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">


Date Picker on input field: <input type="text" id="date1" name="date1"/> <br/>
like image 142
SilentTremor Avatar answered Dec 09 '25 22:12

SilentTremor