# Found a couple of really cool simple time pickers

**URL:** <https://discourse.nodered.org/t/found-a-couple-of-really-cool-simple-time-pickers/36601>\
**Category:** Dashboard\
**Created:** [26 November 2020 22:58 UTC](https://discourse.nodered.org/t/found-a-couple-of-really-cool-simple-time-pickers/36601 "2020-11-26T22:58:49Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [30 November 2020 21:34 UTC](https://discourse.nodered.org/t/found-a-couple-of-really-cool-simple-time-pickers/36601/4 "2020-11-30T21:34:22Z")

</div>

Hey @ozpos have you tried just using the browsers built in time picker?

the html is...

```auto
<input type="time" id="mytime" >

```

looks like this in chrome desktop...  
 ![WPs071cegM](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/7/a756e0a0e1182c294812c8d8925d2f583e0b16ac.gif)

And looks like this in a mobile...

 ![Screenshot_20201130-215031](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/b/7b3e23fed20c8743c745cdb253e056a6f49bb403.jpeg)

Demo flow that sends the selected value back to node-red...

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/1/71607b38f1ca09b9d3df6c702da5ad7da79be038.png)

```auto
[{"id":"8e64b44c.2f7cc8","type":"ui_template","z":"42ea7bd7.2e3c24","group":"dce9e7a2.d20c78","name":"","order":5,"width":"7","height":"2","format":"<div>\n <input type=\"time\" id=\"timeFrom\" class=\"timepicker\" >\n <input type=\"time\" id=\"timeTo\" class=\"timepicker\" >\n</div>\n\n<script>\n(function(scope) {\n var timepicker = $(\".timepicker\")\n timepicker.on('change', function(evt) {\n scope.send({ topic: this.id, payload: this.value });\n });\n})(scope);\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":420,"y":580,"wires":[["cc14d877.0648c8"]]},{"id":"e1f2906e.5967f","type":"debug","z":"42ea7bd7.2e3c24","name":"","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"payload","targetType":"msg","statusVal":"payload","statusType":"auto","x":750,"y":557,"wires":[]},{"id":"cc14d877.0648c8","type":"switch","z":"42ea7bd7.2e3c24","name":"","property":"topic","propertyType":"msg","rules":[{"t":"eq","v":"timeFrom","vt":"str"},{"t":"eq","v":"timeTo","vt":"str"}],"checkall":"true","repair":false,"outputs":2,"x":570,"y":580,"wires":[["e1f2906e.5967f"],["77d33f4b.d5cd7"]]},{"id":"77d33f4b.d5cd7","type":"debug","z":"42ea7bd7.2e3c24","name":"","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"payload","targetType":"msg","statusVal":"payload","statusType":"auto","x":750,"y":604,"wires":[]},{"id":"dce9e7a2.d20c78","type":"ui_group","name":"Object detection","tab":"5132060d.4cde48","order":1,"disp":true,"width":"7","collapse":false},{"id":"5132060d.4cde48","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

---

_[View the full topic](https://discourse.nodered.org/t/found-a-couple-of-really-cool-simple-time-pickers/36601)._