Menu
i am using datetimepicker plugin.I am getting a strange error. whenever i am selecting a time from the dropdown ,the plugin selects one hour before of the selected time. Couldn't figure out why this is happening
<!DOCTYPE html>
<html>
<head>
<title> Date Time Picker </title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.min.css" />
</head>
<body>
<input type="text" value="2:00 PM" id="timepicker" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js" ></script>
<script>
$('#timepicker').datetimepicker({
datepicker: false,
step:30,
format:'g:i A'
});
</script>
</body>
</html>The answers i got this post is to Change the g in the format option to Capital G. but when i changed like this means 12 hours format has been changed to 24 hour format.I want to have it to retain 12 hours format and solve this issue
901
Just change format g:i A to H:i A:
<!DOCTYPE html>
<html>
<head>
<title> Date Time Picker </title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.min.css" />
</head>
<body>
<input type="text" value="2:00 AM" id="timepicker" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js" ></script>
<script>
$('#timepicker').datetimepicker({
datepicker: false,
step:30,
format:'H:i A'
});
$('#timepicker').change(function(){
$(this).val($(this).val().replace(/^0+/, ''));
});
</script>
</body>
</html>It is because you are using invalid format. Just use format:'H:i A' instead of format:'g:i A'
$('#timepicker').datetimepicker({
datepicker: false,
step: 30,
format:'H:i A'
});<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.min.css" />
<input type="text" value="2:00 AM" id="timepicker" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js"></script>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
