# Custom date and time picker

**URL:** <https://discourse.nodered.org/t/custom-date-and-time-picker/7766>\
**Category:** Dashboard\
**Created:** [9 February 2019 08:17 UTC](https://discourse.nodered.org/t/custom-date-and-time-picker/7766 "2019-02-09T08:17:19Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![darabontors](https://avatars.discourse-cdn.com/v4/letter/d/8e7dd6/32.png) [@darabontors](https://discourse.nodered.org/u/darabontors)\
**Post date:** [9 February 2019 08:17 UTC](https://discourse.nodered.org/t/custom-date-and-time-picker/7766/1 "2019-02-09T08:17:19Z")

</div>

Hello dear Node-RED community,

First of all, I would like to thank the whole Node-RED community for supporting this great platform. I am new to Node-RED, with a couple of months of tinkering behind me, but I already love the whole concept and workflow of it. So thank you for all of your efforts!

I found this Date and Time picker and I really like how it works. That said, I am struggling to integrate it in the dashboard. It is called angular-moment-picker and it's great that it has date and also time selection very granular,down to the seconds.

These are the pages of the picker:

> **[Angular Moment Picker](https://indrimuska.github.io/angular-moment-picker/?fbclid=IwAR0nGPKm3d2SfVNi5iPHL96BPPKNgW-eOqXsVvdRMSgbAhWVKjorqiQizlw)**
>
> Angular Moment Picker is an AngularJS directive for date and time picker using Moment.js

> **[indrimuska/angular-moment-picker](https://github.com/indrimuska/angular-moment-picker#momentpickerprovider)**
>
> Angular Moment Picker is an AngularJS directive for date and time picker using Moment.js. - indrimuska/angular-moment-picker

My problem is, I can't figure out where to put the script part of the code and also where to paste this part:

Add _moment-picker_ dependency to your module:

var myApp = angular.module('myApp', ['moment-picker']);

Could someone please help me with this?

Thank you,  
Örs

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [9 February 2019 17:48 UTC](https://discourse.nodered.org/t/custom-date-and-time-picker/7766/2 "2019-02-09T17:48:08Z")

</div>

I don't believe you can use Angular modules in the Dashboard.

---

<div class="post-metadata">

**Author:** ![darabontors](https://avatars.discourse-cdn.com/v4/letter/d/8e7dd6/32.png) [@darabontors](https://discourse.nodered.org/u/darabontors)\
**Post date:** [9 February 2019 20:53 UTC](https://discourse.nodered.org/t/custom-date-and-time-picker/7766/3 "2019-02-09T20:53:09Z")

</div>

Thank you for your response. Is there a way to make it work? Or what is the easiest method of making this to work? uibuilder maybe or some other way?

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [9 February 2019 21:37 UTC](https://discourse.nodered.org/t/custom-date-and-time-picker/7766/4 "2019-02-09T21:37:14Z")

</div>

Hi, yes you can certainly do this with uibuilder with a version of Angular. We don't have an Angular example in the WIKI so if you do try it, please consider creating a WIKI entry 😄

The downside of using Angular is that it is very heavy on resources and very complex to build apps. That's fine if your app has to be very complex but not so good otherwise. Dashboard nicely hides the complexity for you of course but at the expense of limiting what you can do.

Adding a component that uses moment - which itself is pretty resource intensive - will make that worse of course and you may find that your web app doesn't work well with some mobile browsers.

Using uibuilder with something like VueJS is much more lightweight. Because Vue is very popular, there are numerous date/time pickers available for it.
