Bootstrap datepicker -- how to get date as a string in the right format?

Question

I'm using Bootstrap datepicker. The answer is probably obvious, but I can't figure out how to get the selected date as a string in the specified format. I used:

<div id="myDate" data-date-format="yyyy-mm-dd">
  <input type="text">
</div>

And in my javascript:

var value = $("#myDate").datepicker("getDate");

But it returns a date, not a string in yyyy-mm-dd format.

Terracotta

Answer 1

The data-date-format="mm/dd/yyyy" needs to be set on the input:

<input type="text" data-date-format="MM/DD/YYYY">

Your jQuery should also be changed to:

var value = $("#myDate input").datepicker("getDate");

Or you can just keep things simple with no wrapping div and with this your original jQuery would work fine and you wouldn't have to specify input:

<input type="text" id="myDate" data-date-format="YYYY-MM-DD">

Suggestion
I would recommend creating a class to format the datepicker. So that you can then add the .datepicker class to any input field and it would work without having to specify another variable.

Fiddle
Here is working code with alert of date http://jsfiddle.net/doitlikejustin/HFuDg/1/

Samalla

Thanks. I actually omitted some things. The wrapping div includes a <span class="add-on"> – Terracotta

I see. Did adding the data-date-format to the input fix the issue, or is it still happening? – Samalla

Still happening. The getDate method still returns an object. It's a different object now, and appears to be part of the DOM. (The input perhaps?) – Terracotta

@Terracotta Here is a link that shows the results jsfiddle.net/doitlikejustin/HFuDg/1 I also updated my answer – Samalla

I want to collect multiple dates in my datepicker using var nbworkersdate = $('.nbworkersDate',r).datepicker("getDates") and what I get is a list of todays dates not the ones insertted. Why? – Fanestil

Answer 2

var value = $("#myDate").datepicker("getFormattedDate");

Urger

This is an undocumented method and works perfectly. Especially when the date picker is embedded (<div> instead of an <input>). – Woofer

Answer 3

If you want the value as a string use: var value = $("#myDate input").val();

The method getDate returns an object

Week

version 1.9.0 does not return an object – Abohm

Answer 4

you can use:

$("#myDate").data('datepicker').getFormattedDate('yyyy-mm-dd');

you will have it in prover format even if you set a different format to display the data for users like this

<input id="myDate" type="text" data-date-format="MM/DD/YYYY">

Abohm