# Format the date picker

**URL:** <https://forum.bubble.io/t/format-the-date-picker/156523>\
**Category:** Database\
**Created:** [June 20, 2021, 11:41pm UTC](https://forum.bubble.io/t/format-the-date-picker/156523 "2021-06-20T23:41:58Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\
**Post date:** [June 20, 2021, 11:41pm UTC](https://forum.bubble.io/t/format-the-date-picker/156523/1 "2021-06-20T23:41:58Z")

</div>

I have tried to format the date picker so that the month is spelt out, ie: September 12, 2021 (instead of 12/09/2021).

But the initial content I used turns red and I can’t get anything to work?

 ![date](https://us1.discourse-cdn.com/bubble/original/3X/0/2/0212a2077c2f1b7372748236efdae5788ff7bea3.png)

---

<div class="post-metadata">

**Author:** ![jared.gibb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jared.gibb/32/123329_2.png) [@jared.gibb](https://forum.bubble.io/u/jared.gibb)\
**Post date:** [June 21, 2021, 12:09am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/2 "2021-06-21T00:09:06Z")

</div>

Have you checked out the air date/time picker plugin? I _think_ you can set up the picker to have that format

---

<div class="post-metadata">

**Author:** ![sudsy](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sudsy/32/114637_2.png) [@sudsy](https://forum.bubble.io/u/sudsy)\
**Post date:** [June 21, 2021, 1:29am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/3 "2021-06-21T01:29:32Z")

</div>

> [@darren.james7518](#):
>
> But the initial content I used turns red and I can’t get anything to work?

That’s because the **Initial content** property expects a Bubble **date** data type, and you’re providing a **text** type. (Using `:formatted as` returns a “string” - i.e. **text** type.)

The solution is simple. Just edit the style for that element. What you are seeing is just the default style for the **Date/Time Picker** element, but it can be changed.

 ![datetime-picker-style](https://us1.discourse-cdn.com/bubble/original/3X/a/a/aafabe78840e76b7da772f161f325e36194416b1.png)  
&nbsp;  
&nbsp;  
 ![date-format](https://us1.discourse-cdn.com/bubble/original/3X/e/e/eeadb035e2d6d068e0f4dd6cfe2e9d8253cef949.png)

-Steve

---

<div class="post-metadata">

**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\
**Post date:** [June 21, 2021, 9:11am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/4 "2021-06-21T09:11:23Z")

</div>

Thanks Steve, that was a great (simple) solution. Whilst I am here, I had another question; the time defaults to 12:00 and I want to to default to either the users current time or 00:00 - do you know how that can be done?

---

<div class="post-metadata">

**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\
**Post date:** [June 21, 2021, 9:11am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/5 "2021-06-21T09:11:59Z")

</div>

I did check it out but for some reason I opted against it - I can’t remember my reasons as was a while ago. Thanks for suggestion though.

---

<div class="post-metadata">

**Author:** ![sudsy](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sudsy/32/114637_2.png) [@sudsy](https://forum.bubble.io/u/sudsy)\
**Post date:** [June 21, 2021, 1:35pm UTC](https://forum.bubble.io/t/format-the-date-picker/156523/6 "2021-06-21T13:35:30Z")

</div>

> [@darren.james7518](#):
>
> the time defaults to 12:00 and I want to to default to either the users current time or 00:00 - do you know how that can be done?

That’s what the **Initial content** property is for. It allows you to specify the default value for the input. Just set it to the desired date/time. Use the `Change hours|minutes|seconds to` expressions to set a specific time; or use the `Current date/time` expression for the user’s current date and time. See [the docs](https://manual.bubble.io/core-resources/data/operations-and-comparisons#change-seconds-to) for details.

-Steve

---

<div class="post-metadata">

**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\
**Post date:** [June 23, 2021, 9:11am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/7 "2021-06-23T09:11:42Z")

</div>

Thank you!

---

<div class="post-metadata">

**Author:** ![linda1](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/linda1/32/99954_2.png) [@linda1](https://forum.bubble.io/u/linda1)\
**Post date:** [August 10, 2021, 7:51am UTC](https://forum.bubble.io/t/format-the-date-picker/156523/8 "2021-08-10T07:51:46Z")

</div>

this solved my issue just now - @sudsy thanks for explaining this
