datepicker - Set dates for jQuery Date Range Picker from input values -
https://github.com/longbill/jquery-date-range-picker
i have working quite can't seem picker use default values set in . there 2 inputs, start date , end date. have value="" date in both should default date datepicker. user has ability change dates.
i've played few different ideas can't grab input's value attribute. insight appreciated.
here code:
<div class="datepicker-to-from"> <input type="date" id="starttimestamp" class="date-picker" value="11/18/2012 05:45 am"> <input type="date" id="endtimestamp" class="date-picker" value="04/09/2014 5:00 pm"> </div> $('.datepicker-to-from').daterangepicker({ format: 'mm/dd/yyyy hh:mm a', showshortcuts: false, time: { enabled: true }, getvalue: function(){ $('#starttimestamp').val() + ' ' + $('#endtimestamp').val(); }, setvalue: function(){ $('#starttimestamp').val(); $('#endtimestamp').val(); }, startdate: $('#starttimestamp').val() });
update 4/10/2015: after both andybeli , f, solved problem. final js code looks run similar situation.
$('.datepicker-to-from').daterangepicker({ format: 'mm/dd/yyyy hh:mm a', showshortcuts: false, time: { enabled: true }, setvalue: function(s,s1,s2){ $('#starttimestamp').val(s1); $('#endtimestamp').val(s2); }, }); var startdate = $('#starttimestamp').val(); var enddate = $('#endtimestamp').val(); $('.datepicker-to-from').data('daterangepicker').setdaterange(startdate,enddate);
the plugin needs actual date object function. luckily value="" string enough create such object using new date()
:
<div class="datepicker-to-from"> <input type="date" id="starttimestamp" class="date-picker" value="11/18/2012 05:45"> <input type="date" id="endtimestamp" class="date-picker" value="04/09/2014 5:00"> </div> $(function(){ $('.datepicker-to-from').daterangepicker({ format: 'mm/dd/yyyy hh:mm', showshortcuts: false, time: { enabled: true } }); // values , create date objects var date1 = new date($('#starttimestamp').val()); var date2 = new date($('#endtimestamp').val()); // set values $('#starttimestamp).val(fancy_date(date1)); $('#endtimestamp').val(fancy_date(date2)) // formatting function addzero(i) { if (i < 10) { = "0" + i; } return i; } function fancy_date(dateobj) { return addzero(dateobj.getmonth()) + '/' + addzero(dateobj.getdate()) + '/' + addzero(dateobj.getfullyear()) + ' ' + addzero(dateobj.gethours()) + ':' + addzero(dateobj.getminutes()); } });
if absolutely need show am/pm check answer. shouldnt hard adapt this.
the standard setters , getters, $(dom).setdate()
pain, since dealing 2 input fields, hold desired values anyway.
i stole addzero function w3 js, check out dates more information.