# Select month and year DateTimePicker

**URL:** <https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [March 29, 2023, 6:16pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790 "2023-03-29T18:16:57Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![italogustavoaraujo](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/italogustavoaraujo/32/55235_2.png) [@italogustavoaraujo](https://forum.inductiveautomation.com/u/italogustavoaraujo)\
**Post date:** [March 29, 2023, 6:16pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/1 "2023-03-29T18:16:57Z")

</div>

Hello, I need to pass to a script just the month and year in an input component.

I am not able to customize the component below to show only the months and years for selection.

Has anyone already created a similar component?

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/e/ceb44dfb840a9e21db63a277a327c7d9e581c564.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/c/1c0a1ebb596bf019211fa9e6581b3aac69f385f1.png)

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [March 29, 2023, 6:58pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/2 "2023-03-29T18:58:07Z")

</div>

Why don't you place two Dropdowns - one for the month and one for the year?

---

<div class="post-metadata">

**Author:** ![leonardo.godoi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/leonardo.godoi/32/27178_2.png) [@leonardo.godoi](https://forum.inductiveautomation.com/u/leonardo.godoi)\
**Post date:** [March 29, 2023, 9:12pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/3 "2023-03-29T21:12:32Z")

</div>

Dropdown with dates seems like your best option.  
If you want to retrieve just the month from the date component you could add a custom property with the following expression:

```auto
dateFormat({value},"yyyy-MM")

```

Here`'s a result:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/9/7935c994838b3bb1221d9cff50faed457947a0c1.png)

You can check out more about the **dateFormat()** expression here:  
[https://docs.inductiveautomation.com/display/DOC81/dateFormat](https://docs.inductiveautomation.com/display/DOC81/dateFormat)

Also, there's the **Overflow** style property, it might be useful in some other instance since in this one it would reduce the component to basically two dropdowns anyway.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/7/374ce62c879a7dbafa48342c32ace7b4ffcce032.png)

---

<div class="post-metadata">

**Author:** ![mdemaris](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdemaris/32/54639_2.png) [@mdemaris](https://forum.inductiveautomation.com/u/mdemaris)\
**Post date:** [November 15, 2023, 12:32am UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/4 "2023-11-15T00:32:10Z")

</div>

The problem with this is that the value does not change unless you select the actual day on the calendar.

---

<div class="post-metadata">

**Author:** ![mdemaris](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdemaris/32/54639_2.png) [@mdemaris](https://forum.inductiveautomation.com/u/mdemaris)\
**Post date:** [November 15, 2023, 12:36am UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/5 "2023-11-15T00:36:04Z")

</div>

How would one go about the years drop down? If the time spans decades, and I'm assuming that each year value would be hard-coded, this would take a lot of work, and probably won't be dynamic.

Is there a script that could pull a range of years, based on the current year, and populate the values and options?

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 15, 2023, 1:27pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/6 "2023-11-15T13:27:50Z")

</div>

- On your dropdown create a custom property.  
`ddYears : 10`
- Right click on the dropdown component, select _Convfigure Events_.
- Add in the code as shown below.

> **Dropdown onStartup code**
>
> ```auto
> def runAction(self):
> options = []
> ddYears = self.custom.ddYears
> thisYear = system.date.getYear(system.date.now())
> 	
> for i in range(ddYears):
> yyyy = thisYear + i
> options.append({"value": yyyy, "label": yyyy})
> 	
> self.props.options = options
> 
> ```

Make sure that all the indentations are correct and either all spaces or all tabs.

 ![Dropdown populate](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/7/8736b1a09bbfb9a51e03656583cac81ecd6e1fd9.png)

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [November 19, 2023, 4:58pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/7 "2023-11-19T16:58:39Z")

</div>

This really depends on your use-case. Do you only need years _after_ this year? Including this year? How far out?

The script provided by @Transistor should get you most of the way, but this is probably better realized as a binding with a transform. Bind against an expression which gets you the current year, then add options as you see fit within a transform:

```auto
options = []
options.append({"value": value, "label": value}) # include current year
for i in range(self.custom.year_range): # where year_range is how far into the past/future you want to include years
    year = value - i
    options.append({"value": year, "label": year}) # include previous years
    year = value + i
    options.append({"value": year, "label": year}) # include coming years

```

---

<div class="post-metadata">

**Author:** ![mdemaris](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdemaris/32/54639_2.png) [@mdemaris](https://forum.inductiveautomation.com/u/mdemaris)\
**Post date:** [November 21, 2023, 8:18pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/8 "2023-11-21T20:18:53Z")

</div>

I got this to work, but you do have to change the value of `thisYear` as it loops through, otherwise you get the same number.

```auto
def runAction(self):
	options = []
	ddYears = self.parent.custom.year_range
	thisYear = system.date.getYear(system.date.now())
	
	options.append({'value': thisYear, 'label': thisYear})
	
	for i in range(ddYears):
		thisYear = thisYear - 1
		options.append({'value': thisYear, 'label': thisYear})
		
	self.props.options = options

```

---

<div class="post-metadata">

**Author:** ![mdemaris](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdemaris/32/54639_2.png) [@mdemaris](https://forum.inductiveautomation.com/u/mdemaris)\
**Post date:** [November 21, 2023, 8:29pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/9 "2023-11-21T20:29:11Z")

</div>

I am not sure which binding to use to get the current year.

It does not like this one:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/a/ba75f17da1c2df0cc7a97511ee8ab928cba4b0ce.png)

Nor this:

```auto
options = []
options.append({"value": {value}, "label": {value}})
for i in range({parent.custom.year_range}):
	year = year - 1
	options.append({"value": year, "label": year})

```

---

<div class="post-metadata">

**Author:** ![CalebM](https://avatars.discourse-cdn.com/v4/letter/c/71c47a/32.png) [@CalebM](https://forum.inductiveautomation.com/u/CalebM)\
**Post date:** [November 21, 2023, 9:18pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/10 "2023-11-21T21:18:39Z")

</div>

I think you have mixed parts from expression and script transforms. You will want to change to a script transform. You'll reference the value as a variable with the name of `value`.

```auto
options = []
options.append({"value": value, "label": value})
for i in range(parent.custom.year_range):
	year = year - 1
	options.append({"value": year, "label": year})
return options

```

However I think there is a flaw in your code as `year` is never set.

It is also probably worth mentioning that calling `now()` without a polling rate will default to updating every second. So it will be worth setting to 0.

---

<div class="post-metadata">

**Author:** ![mdemaris](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdemaris/32/54639_2.png) [@mdemaris](https://forum.inductiveautomation.com/u/mdemaris)\
**Post date:** [November 21, 2023, 9:55pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/11 "2023-11-21T21:55:45Z")

</div>

I see:

```auto
def transform(self, value, quality, timestamp):
	year = int(value)
	options = []
	options.append({"value": year, "label": year})
	for i in range(0, self.parent.custom.year_range):
		year = year - 1
		options.append({"value": year, "label": year})
	return options

```

But I don't see polling options for getting the date, unless there is some expression that could limit that.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 21, 2023, 9:57pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/12 "2023-11-21T21:57:39Z")

</div>

> [@mdemaris](#):
>
> I got this to work, but you do have to change the value of `thisYear` as it loops through, otherwise you get the same number.

No, my code is automatically incrementing because `i` increments on each loop.

```auto
	for i in range(ddYears):
		yyyy = thisYear + i

```

---

<div class="post-metadata">

**Author:** ![CalebM](https://avatars.discourse-cdn.com/v4/letter/c/71c47a/32.png) [@CalebM](https://forum.inductiveautomation.com/u/CalebM)\
**Post date:** [November 22, 2023, 1:45pm UTC](https://forum.inductiveautomation.com/t/select-month-and-year-datetimepicker/71790/13 "2023-11-22T13:45:12Z")

</div>

You could turn off polling in the expression binding by specifying the polling rate on [now](https://docs.inductiveautomation.com/display/DOC81/now).  
`getYear(now(0))`