Cách sử dụng kiểu input year trong HTML

Kiểu input month được dùng trong HTML bằng <input type="month">. Cho phép người dùng chọn tháng và năm. Nhưng nếu chỉ muốn hiển thị popup chọn năm? Kiểu input year không có sẵn.

Để dùng kiểu nhập năm, ta dùng jQuery để thêm datepicker. Sử dụng với kiểu input text. Khi chạy chương trình, chỉ năm hiển thị.

Ví dụ

Bạn có thể chạy mã sau để học cách dùng kiểu input để đặt năm:

<html>
  <head>
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
      $(function() {
        $("#date").datepicker({dateFormat: 'yy'});
      });
    </script>
  </head>
  <body>
    <form action="" method="get">
      Thông tin:<br><br>
      Tên sinh viên <br>
      <input type="text" name="sname"> <br>
      Năm sinh <br>
      <input type="text" id="date"> <br>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

Lưu ý: Ví dụ dùng jQuery UI Datepicker (cần thêm CSS và JS của jQuery UI). HTML5 hiện tại đã hỗ trợ <input type="year"> trong một số trình duyệt hiện đại, nhưng hỗ trợ chưa rộng rãi.