# How to change time picker format ui 24 hours in node red

**URL:** <https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814>\
**Category:** Dashboard\
**Created:** [23 July 2021 12:53 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814 "2021-07-23T12:53:34Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![Apoki21](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/apoki21/32/44302_2.png) [@Apoki21](https://discourse.nodered.org/u/Apoki21)\
**Post date:** [23 July 2021 12:53 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/1 "2021-07-23T12:53:34Z")

</div>

Hi Guys, i need help  
i problem, how to change format time picker to 24 hours  
This my flow:  
 ![Screenshot](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/c/bc3b7d1a9b9204e720c3524ceee3accc9ca63f5b.png)  
and this on dashboard  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/b/9bb5e72f0c079eb3dcd9cc0ff4a3662b01f523b7.png)

Thanks you all

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [23 July 2021 18:03 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/2 "2021-07-23T18:03:41Z")

</div>

How the time is displayed (across Node-Red Dashboard it seems) is dependent on the settings in your Browser. You will have to Google for your particular one.

Mine is Chrome and it is based on the regional language chosen... go fig?

Canada = 24 hour  
US = 12 hour

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/6/665db44a142fb22597f9c5ca7990d45c3d9553df.png)

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [23 July 2021 18:16 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/3 "2021-07-23T18:16:24Z")

</div>

Hmmm... althogh now after I changed mine (from 12 to 24) to test this... once I switch back to 12 hour time, the form stays\* at 24 hour.

- Even after completely removing the node and starting NR anew... stranger and stranger...

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/5/c52826747c01b60b32a92cf4cc18f61f95802fa1.png)

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [23 July 2021 22:32 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/4 "2021-07-23T22:32:15Z")

</div>

Did you flush the cache?

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [23 July 2021 23:12 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/5 "2021-07-23T23:12:35Z")

</div>

Yes, but no differance. I don't use that node so no bid deal for me. Just a bit strange as I watched it change from 12 to 24 just fine.

My just deserts, messing up my system for doing the Googling, forum searching and trial reasearch others won't do for themselves 😛

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [23 July 2021 23:26 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/6 "2021-07-23T23:26:12Z")

</div>

Fiddled around with the Windows regional formatting a bit, and it (the time option in `form` node) went back to 12 hour... so apperently both Browser and OS regional formatting can affect this. Makes sense, but not clear on whitch has priority.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [24 July 2021 06:28 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/7 "2021-07-24T06:28:28Z")

</div>

> [@Gunner](#):
>
> Even after completely removing the node and starting NR anew... stranger and stranger...

This is nothing to do with node red, so that wouldn't make any difference. It is purely down to the OS and browser.

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [24 July 2021 06:38 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/8 "2021-07-24T06:38:35Z")

</div>

> [@Colin](#):
>
> This is nothing to do with node red

Excepting the fact that it affects how a Time related feature is used or displayed in Time related nodes made for use in Node-Red... yes, nothing at all 😛

But that all pedantry aside 😆 ... I was just answering the OP's question, _mission accomplished_, and musing about the complexities of how such 3rd party manipulation is a significant factor in how we read and react to "regionaly" displayed time... and in differing ways withing the "same" application.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [24 July 2021 06:50 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/9 "2021-07-24T06:50:51Z")

</div>

Well it is the browser that is rendering it as it is an html5 component, and Node-RED tries to use standard components, so …

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [24 July 2021 06:54 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/10 "2021-07-24T06:54:54Z")

</div>

I did mention I was just musing 😛 Yes, I am now fully aware of what was causing the OP issue and why.

Further experimenting would probaly confirm my suspision that the Browser affected one of my time displays and the OS another, but honestly I was finished with this topic 8 hours ago.

I should have just let all other comments slide... my bad 😇

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [24 July 2021 07:01 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/11 "2021-07-24T07:01:57Z")

</div>

I meant that the way it is displayed is nothing to do with node red, so removing and replacing the node, and restarting node-red, will not make any difference.

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [24 July 2021 07:04 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/12 "2021-07-24T07:04:36Z")

</div>

Yes, I had already figured that part out later in the topic.

I just have a quirky & sarcastic sense of humor, sorry if I came across otherwise.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [24 July 2021 07:11 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/13 "2021-07-24T07:11:02Z")

</div>

Even slight frustration can turn into creativeness and motivator. It is very known that standard components work as they do and only way to fight with it is to do custom components. Here in Node-RED world we do it pretty often, firstly for our own usage and then we share them and we learn that useful components turned out good but not enough because of many many other use cases you haven't even tough about will rise up.  
Beautiful world 🙂

---

<div class="post-metadata">

**Author:** ![Gunner](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gunner/32/43582_2.png) [@Gunner](https://discourse.nodered.org/u/Gunner)\
**Post date:** [24 July 2021 08:30 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/14 "2021-07-24T08:30:41Z")

</div>

> [@Apoki21](#):
>
> how to change format time picker to 24 hours

OK, after much attempts to ignore this topic after I determined it was OS (Windows and Android in my tests) or Browser (Chrome) related... I decided to determine _which_ one.

Turns out it is BOTH.

To get reliable results, I had to change the OS first, then the Browser.

In fact, on my one tablet I had the set times showing 24 hour but the picker still with AM/PM 😅

The only thing I can say further is that this has taken too much of my time... in either method of looking at it 🤣

---

<div class="post-metadata">

**Author:** ![Apoki21](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/apoki21/32/44302_2.png) [@Apoki21](https://discourse.nodered.org/u/Apoki21)\
**Post date:** [24 July 2021 10:18 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/15 "2021-07-24T10:18:08Z")

</div>

Thank u all for respon

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [7 August 2021 10:19 UTC](https://discourse.nodered.org/t/how-to-change-time-picker-format-ui-24-hours-in-node-red/48814/16 "2021-08-07T10:19:08Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
