i need setup datepicker allows user set time. 6/6/16 03:28 pm
$(".datepicker").each(function(index){ var picker = new pikaday({ field: $(this)[0], position: 'bottom left', format: "d/m/yy hh:mm a" }); }); however, while got format working, pikaday keeps reverting 12:00 am.
what doing wrong? here's working example of issue https://jsfiddle.net/pturula/hcba6l33/
as long understand, pikaday datepicker, not date&time picker returns standard javascript date object which, in fact, works complete timestamps.
dates represented timestamp @ 0:00h (or 12:00pm).
because pikaday uses standard javascript date object, can specify valid formatting string if includes time of day parts, can pick days, 0:00h timestamp.
if want date , time picker, should search imlementation or implement (for example using pikaday , jquery timepicker).
hope helps...
edit: said om comments, can implement 2 sepparated fields working single one.
here jsfiddle example: https://jsfiddle.net/l82h4x1y/
$(".datepicker").each(function(index){ var container = $("<span></span>"); var datefld = $("<input type=\"date\"></input>") .attr("placeholder", "dd/mm/yyyy") .appendto(container) ; var timefld = $("<input type=\"time\"></input>") .attr("placeholder", "h:mm [pm|am]") .appendto(container) ; var target = $(this) // original input field. .replacewith(container) // replace in dom. .appendto(container) // reinsert inside new container. .hide() // hide (hint: comment out me debug). ; var picker = new pikaday({ field: datefld[0], //format: "d/m/yy hh:mm a" format: "d/m/yy" }); function updatefld(){ // calculate date part: // -------------------- try { var d = new date(datefld.val()); if (isnan(d)) throw "wrong date"; } catch (e) { var d = new date(); // use current day on invalid values. }; d = d.getdate() +"/"+(d.getmonth()+1) // "+1" fixes .getmongh() counting 0. +"/"+d.getfullyear() ; // calculate time part: // -------------------- try { var t = new date( "2000/1/1 " // prepend valid date (notice ending space). +timefld.val() ); if (isnan(t)) throw "wrong time"; } catch (e) { var t = new date("2000/1/1 0:0"); // use 0:00 on invalid values }; t = t.gethours() // 0-23 +":"+t.getminutes(); // update target field: // -------------------- // target.val(d+" "+t); // note: receive 24h date. if need "am/pm" // should few more plumbing. }; datefld.on("change", updatefld); timefld.on("change", updatefld); }); relevant notes:
notice input fields does'nt have "name" attributes, field send on submit original one.
time field accepts am/pm or 24h (any valid javascript date object time) original field filled standard date/time (24h). if it's not want, need few more plumbing.
as said, can add timepicker plugin time field (i didn't yet).
for better testing in jsfiddle, comment out ".hide()" row of original field. way see effect in real time.
