JSFiddle - React, Tailwind, and code Playground

by Martin Renvoize

HTML

<!DOCTYPE HTML>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.8.23/themes/base/jquery-ui.css" >
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.js"></script>
    </head>
    <body>
        <input type="text" value="Normal input field">
        <input type="text" id="myDate">
        <span id="info">Info</span>
    </body>
</html>

JavaScript

$(document).ready(function() {
  var doKeyDown = $.datepicker._doKeyDown
  $.extend($.datepicker, {
    _doKeyDown: function(event) {
      if (event.which === $.ui.keyCode.LEFT || event.which === $.ui.keyCode.RIGHT || event.which === $.ui.keyCode.UP || event.which === $.ui.keyCode.DOWN) {
        console.log(event);
        event.ctrlKey = true;
        doKeyDown(event);
      } else {
        console.log(event);
        doKeyDown(event);
      }
    }
  });

  $("#myDate").datepicker();
});