วิธาใช้ Input Type Datetime-local ใน HTML

บทนำ

ใช้ <input type="datetime-local"> สำหรับเลือกวันที่และเวลา (ไม่มี Timezone) แสดง Date-Time Picker

ตัวอย่างโค้ด

<!DOCTYPE html>
<html>
  <head>
    <title>HTML Input Datetime-local</title>
  </head>
  <body>
    <form action="" method="get">
      รายละเอียด:<br><br>
      ชื่อนักเรียน<br>
      <input type="text" name="sname"><br>
      วันเวลาสอบ<br>
      <input type="datetime-local" name="datetime"><br>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

รูปแบบค่า

• รูปแบบ: YYYY-MM-DDTHH:MM (เช่น 2024-03-15T13:30)
• ไม่มี Timezone (ใช้ Local Time)
• รองรับวินาที: YYYY-MM-DDTHH:MM:SS

แอตทริบิวต์เสริม

• min - วันเวลาต่ำสุด (เช่น "2024-01-01T00:00")
• max - วันเวลาสูงสุด
• step - ช่วงเวลา (default 60 วินาที, step="900" = 15 นาที)
• readonly, disabled, required

การตั้ง Min/Max เป็นวันนี้ (JavaScript)

const now = new Date();
now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
document.getElementById('dt').min = now.toISOString().slice(0, 16);

การรองรับเบราว์เซอร์

รองรับใน Chrome, Edge, Safari, Opera ไม่รองรับใน Firefox และ IE (Firefox ใช้ Polyfill)

หมายเหตุ

datetime (มี Timezone) ถูก Deprecated แล้ว ใช้ datetime-local แทน