Develop Reference

How to display a.m instead of AM using date-and-time library?

Given a string like
const time = "06:15:00"
This is 6:15 am
date.format(time, "h:mm A") // 6:15 AM
I want 6:15 a.m.
date.format(time, "h:mm aa")
doesn't work for some reason
Is there a way?

You have to add meridiem plugin
date.plugin('meridiem')
const time = date.parse('06:15:00', 'hh:mm:ss')
console.log(date.format(time, 'hh:mm aa'))
<script src="https://rawcdn.githack.com/knowledgecode/date-and-time/a5f31dcb3fe1bd02fd8ff7770552c73a4401d0a1/date-and-time.min.js" type="text/javascript"></script>
<script src="https://rawcdn.githack.com/knowledgecode/date-and-time/a5f31dcb3fe1bd02fd8ff7770552c73a4401d0a1/plugin/meridiem.js" type="text/javascript"></script>

date range picker get current dates in the end range

I am using flask to build some small application. I would like to build a form that collects a start date and an end date. Ideally I would like this form data to my database to run some search on date range. I found some example that is fairly close to what I am trying to do. One thing that I cant figure out is in the example the date range is predefined. I would like for at least the end date to be updated with the current date and not a predefined field.
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<!-- Include Date Range Picker -->
<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />
<input style="width: 40%" class="form-control" type="text" name="daterange" value="01/01/2015 - 01/31/2015" />
<script type="text/javascript">
$('input[name="daterange"]').daterangepicker(
{
locale: {
format: 'MM-DD-YYYY'
},
startDate: '01-01-2013',
endDate: '12-31-2013'
},
function(start, end, label) {
alert("A new date range was chosen: " + start.format('MM-DD-YYYY') + ' to ' + end.format('MM-DD-YYYY'));
});
</script>

Substitute 'moment()' for the hardcoded end date.
Example:
$('input[name="daterange"]').daterangepicker(
{
locale: {
format: 'YYYY-MM-DD'
},
startDate: '2013-01-01',
endDate: moment()
},
function(start, end, label) {
alert("A new date range was chosen: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
});
(Also, not sure if this was a copy/paste issue - but you are missing the 'https:' prefix on your script and stylesheet imports.)

How to use JQuery and moment.js to automatically change date locale?

I want to change a fixed timestamp in English to German automatically with moment.js.
The timestamp looks like the following:
<time class="entry-timeago timestamp" datetime="2016-09-06">a month ago</time>
For this I have added the following code:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/locale/de.js"></script>
<script type="text/javascript">
var language = window.navigator.userLanguage || window.navigator.language;
moment.locale(language);
$('.timestamp').each(function (i, date) {
var $date = $(date);
$date.html(
moment($date.attr('datetime'))
.format('ll')
);
});
</script>
With this code I still cannot see a difference (even if I set moment.locale('de'); manually) and I wonder why.
Thanks for help.

bootstrap datepicker set default date not working

I am using bootstrap datepicker.I want to show 01-01-1960 as selected date in my calendar when it is loaded first time.
javascript
<script src="~/Content/js/datepicker/bootstrap-datepicker.js"></script>
<link href="~/Content/js/datepicker/datepicker.css" rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function () {
$('.datepicker-input').datepicker({
defaultViewDate: { year: 1960, month: 01, day: 01 },
format: 'mm-dd-yyyy',
});
});
I am using this theme - http://flatfull.com/themes/scale/form-elements.html.

You can set default date like :
<script src="~/Content/js/datepicker/bootstrap-datepicker.js"></script>
<link href="~/Content/js/datepicker/datepicker.css" rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function () {
$('.datepicker-input').datepicker({
'setDate', new Date(1960, 01, 01 ),
'format': 'mm-dd-yyyy',
});
});
</script>

Try with this.
<script type="text/javascript">
$(document).ready(function () {
$('.datepicker-input').datepicker({
dateFormat: 'yy-mm-dd'
});
$('.datepicker-input').datepicker('setDate', new Date(1960,00,01));
$('.datepicker-input').val('');
});
</script>
It Works for me.

$('.datepicker-input').datepicker({
useCurrent: false,
setDate: new Date(1960, 01, 01),
});
Set useCurrent to false, then setDate would work.

To fix the following error:
error-Uncaught TypeError: data[option] is not a function
You should use the option setValue instead of setDate!
$(".datepicker-input").datepicker("setValue", new Date());

I found the simple solution for setting default value on this problem.
According to the research from google, you cannot simple add 'default date' option here but you can set 'setDate' option. Thus, For example...
<div class="fullDate input-group date" id="atdcRegReqDtDiv">
<input type="text" class="form-control inputstl" id="REQ_DT">
<span class="input-group-addon"><i class="dtPick glyphicon glyphicon-calendar"></i></span>
</div>
Add the setDate option, to the object, and then put empty value to the text input.
$('#atdcRegReqDtDiv').datepicker('setDate', "2018-09-14");
$('#REQ_DT').val("");
Then, you can see the empty input box with the calendar has default Year/Month.
Good Luck.

You can set default date using Jquery defaultDate :
defaultDate: new Date(1960, 01, 01);

Need datepicker which shows date in other format

I want a date picker which gives the date in this format
January 19, 2012
I already have some date pickers but they are showing dates like this:
12/10/2013

Lots of formats here
You can even customise them. Hope it helps!

Try this Demo
Script
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
$(function () {
$('#datepicker').datepicker({
dateFormat: 'MM dd,yy', onSelect: function (datetext) {
$('#datepicker').val(datetext);
},
});
});
</script>
HTML
<input type="text" id="datepicker"/>

Try this.
set this to ur date picker.
datePicker.timeZone = [NSTimeZone localTimeZone];
self.datePicker.datePickerMode = UIDatePickerModeDate;