In this tutorial, you will know how to use Timepicker with AM/PM dropdown using jQuery timepicker plugin.
jQuery timepicker is very lightweight timepicker plugin and you can easily use option given in timepicker method.
Passing option is not required with timepicker method is an optional parameters.
It's very easy to set up 12 hours time format with AM/PM using this timepicker plugin.
Following example will tell you how to use timepicker with am/pm dropdown option :
- <html lang="en">
- <head>
- <title>jQuery - set am/pm format using jQuery timepicker Plugin with example</title>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.css">
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.js"></script>
- </head>
- <body>
- <div class="container">
- <strong>Select Time : </strong>
- <input class="form-control" type="text" placeholder="click to show timepicker" id="example1">
- </div>
- <script type="text/javascript">
- $(document).ready(function () {
- $('#example1').timepicker();
- });
- </script>
- </body>
- </html>