テキストフィールドを選択するとカレンダーで入力できる「datetimepicker」を実装

テキストフィールドに決まったフォーマットで日付や時間を入力してもらいたいときはjqueryの「datetimepicker」を実装すると入力が楽になる

実装方法は

下記javascriptをHTMLのどこかに挿入

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!-- jQuery-datetimepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js" integrity="sha512-AIOTidJAcHBH2G/oZv9viEGXRqDNmfdPVPYOYKGy3fti0xIplnlgMHUGfuNRzC6FkzIo0iIxgFnr9RikFxK+sw==" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css" integrity="sha512-bYPO5jmStZ9WI2602V2zaivdAnbAhtfzmxnEGh9RwtlI00I9s8ulGe4oBa5XxiC6tCITJH/QG70jswBhbLkxPw==" crossorigin="anonymous" />

<script type="text/javascript">// <![CDATA[
jQuery(function(){jQuery('#datetimepicker').datetimepicker({format: 'Y-m-d h:i:00'});});
// ]]></script>

実装したいテキストフィールドに

<input id="datetimepicker" name="name" type="text"/>

を挿入するとよい