# Date range selector in Perspective

**URL:** <https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492>\
**Category:** Ignition Early Access\
**Tags:** perspective\
**Created:** [December 23, 2023, 1:13pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492 "2023-12-23T13:13:36Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [December 23, 2023, 1:13pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/1 "2023-12-23T13:13:36Z")

</div>

I wonder is there any hack or tricks to have a nice date range selector like Power Chart range selector in Perspective.  
That one is really nice one and if we can somehow use it separately from Power Chart it would be perfect.

---

<div class="post-metadata">

**Author:** ![swolnisty](https://avatars.discourse-cdn.com/v4/letter/s/7bcc69/32.png) [@swolnisty](https://forum.inductiveautomation.com/u/swolnisty)\
**Post date:** [January 4, 2024, 7:23pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/2 "2024-01-04T19:23:34Z")

</div>

I haven't found any tricks to replicate it, but there is an open request for IA to incorporate this as a component:

> **[Perspective - date picker that allows selecting date range | Ignition...](https://inductiveautomation.canny.io/ignition-features-and-ideas/p/perspective-date-picker-that-allows-selecting-date-range)**

---

<div class="post-metadata">

**Author:** ![Steve\_Laubach](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/steve_laubach/32/60900_2.png) [@Steve\_Laubach](https://forum.inductiveautomation.com/u/Steve_Laubach)\
**Post date:** [January 30, 2024, 9:10pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/3 "2024-01-30T21:10:52Z")

</div>

This is probably not as fancy as you're looking for but it's functional for a small form factor date selection. The double arrows add 24 hours and the single arrows add 1 hour.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/a/6ae2d7771b9163c3f76a31d1fa603e8c8c135ae2.png)

---

<div class="post-metadata">

**Author:** ![mmadariaga](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mmadariaga/32/63201_2.png) [@mmadariaga](https://forum.inductiveautomation.com/u/mmadariaga)\
**Post date:** [June 11, 2024, 2:18pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/4 "2024-06-11T14:18:11Z")

</div>

This looks really clean, how did you do it?

---

<div class="post-metadata">

**Author:** ![Steve\_Laubach](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/steve_laubach/32/60900_2.png) [@Steve\_Laubach](https://forum.inductiveautomation.com/u/Steve_Laubach)\
**Post date:** [June 11, 2024, 2:31pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/5 "2024-06-11T14:31:29Z")

</div>

It's just a date picker control with buttons on either side (flex layout).

The buttons just add or subtract hours with a simple script.

One flex container aligns the label with the stuff on the bottom. Then the stuff on the bottom is inside another flex container (inside the main flex container) that's oriented in the other direction.

---

<div class="post-metadata">

**Author:** ![mmadariaga](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mmadariaga/32/63201_2.png) [@mmadariaga](https://forum.inductiveautomation.com/u/mmadariaga)\
**Post date:** [June 11, 2024, 2:42pm UTC](https://forum.inductiveautomation.com/t/date-range-selector-in-perspective/83492/6 "2024-06-11T14:42:45Z")

</div>

Thanks!