# MultiCalendar module

**URL:** <https://forum.inductiveautomation.com/t/multicalendar-module/86326>\
**Category:** Module Development\
**Tags:** perspective\
**Created:** [February 25, 2024, 7:53pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326 "2024-02-25T19:53:33Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 25, 2024, 7:53pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/1 "2024-02-25T19:53:33Z")

</div>

Hello, I have created a MultiCalendar and MultiDatepicker module, hope here is the right place to share the module which supports Gregorian, Farsi, Jalali, Arabic, Indian calendar and it is in English, Farsi, Arabic and Hindi languages.  
[multicalendar.modl](https://forum.inductiveautomation.com/uploads/short-url/3QJpNxegOI4FDz96N4X8kyupb2X.modl) (43.0 KB)

 ![Screenshot (12)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/1/51dfdab309bfe87044fa819e98d1820e933afbeb.png)  
 ![Screenshot (14)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/8/a89441a3824f786fd30acb7a786a6423bf737133.png)  
 ![Screenshot (15)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/2/12ed1232609417576a56a9990992e42500c54dd8.png)  
 ![Screenshot (16)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/4/14a24071a799a1059f00fd70909b10a60bc344b5.png)  
 ![Screenshot (17)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/2/620126afa4728bdab2923b4d841d9cda10a0f257.png)

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [February 25, 2024, 7:56pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/2 "2024-02-25T19:56:57Z")

</div>

This is a good place. If not free, you will want to get it into the IA module showcase. Talk to your IA sales contact to get that started. (There are some requirements, including having your own website to offer downloads and purchasing instructions.).

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 25, 2024, 8:33pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/3 "2024-02-25T20:33:47Z")

</div>

Being free to use, this is my first module, and i'm seeking tips to improve my development skills.

---

<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:** [February 26, 2024, 12:13am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/4 "2024-02-26T00:13:17Z")

</div>

Thanks for sharing this. Add some screenshots into your first post so that folks will understand what you've done without having to download, ...

I've installed it on my gateway and that forced a Designer restart. It's not showing up in the components palette. How do I use it?

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 26, 2024, 4:23am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/5 "2024-02-26T04:23:10Z")

</div>

I will certainly do it at the first opportunit

---

<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:** [February 26, 2024, 8:29am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/6 "2024-02-26T08:29:26Z")

</div>

Got it, thanks. The Perspective Components search bar doesn't find text in the section headings.

When I saw the "MultiCalendar" name it suggested that it might pick a date range (start and end date, for example) but I guess that you mean multi-cultural / multi-language.

Some suggestions:

- Both components seem to be returning a string. They should really return a date data type.
- All of Perspective's built-in datepickers start on Sunday. If you could provide a Monday start that would solve a problem for many folks.
- The date string format might be wrong. I _think_ that `yyyy-mm-dd` formats use the `-` as the separator. Wikipedia's [Slash (punctuation)](https://en.wikipedia.org/wiki/Slash_(punctuation)#:~:text=Because%20of%20the%20world's%20many,1945%2D05%2D08)) article has some interesting historical explanation. (See the 'Dates' secion.) It also mentions ISO 8601.
- Can you expose the color properties for the weekdays, current day background ;and selected day background. That way they could be bound to the Perspective [Perspective Built-In Themes | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/styles/perspective-built-in-themes).
- If you were able to modify to give a date range selection you would make many people happy.  
 ![Date range selector](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/f/bfcaff10a518f0c81aecb568f3fe74c650dc65f2.png)

_Example from [JavaScript DateRangePicker | HTML5 DateRangePicker | Syncfusion](https://www.syncfusion.com/javascript-ui-controls/js-daterangepicker#:~:text=The%20JavaScript%20Date%20Range%20Picker,the%20HTML%20input%20text%20box).._

Have fun!

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 26, 2024, 12:14pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/7 "2024-02-26T12:14:13Z")

</div>

I appreciate your suggestions and will incorporate them in the next version

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 27, 2024, 8:03pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/8 "2024-02-27T20:03:08Z")

</div>

Please check this, I will implement the rest of changes in future releases.

New changes:

1. Change date format from string to object.
2. Add a date range selector.
3. Select the first day of the week.  
[multicalendar.modl](https://forum.inductiveautomation.com/uploads/short-url/72J9tfskrCtmBo34zv5jrApOvPe.modl) (45.7 KB)

 ![Screenshot (15)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/d/1d5db35bfe594e436961672a5d20435b9f70f23d.png)

---

<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:** [February 27, 2024, 8:13pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/9 "2024-02-27T20:13:23Z")

</div>

Good work. I won't get a chance to look at it for a while.

Further thoughts:

1. Why are you returning the date as an object? Most, if not all, bindings to your component will be looking for a date or date range. (Think tag history, Time Series chart, etc.) Having to convert your objects is another step. Maybe there is a good technical reason.
2. Do you need a property `mode : singleDate / dateRange`? That would tell us whether to expect one or two values returned.
3. On the other hand, why not just two properties, startDate and endDate and make the endDate a null if `mode : singleDate`?
4. I think you need `colorToday` and `colorDateSelection` props.

@nader.chinichian, I thought of you when I saw the first post as you were looking for such a thing. You might have some further comments.

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 27, 2024, 9:01pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/10 "2024-02-27T21:01:33Z")

</div>

1: You're right I'll add this too, I thought the object module would give more data and more is better.  
2: yes one is better than two module but maybe later.  
3: ok  
4: they are active now  
thanks i'll made this changes in next release

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 28, 2024, 7:09pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/11 "2024-02-28T19:09:46Z")

</div>

If any changes are needed I would be happy to know.

[multicalendar.modl](https://forum.inductiveautomation.com/uploads/short-url/g26UwHROc7AZjkdOllil3lw6T2X.modl) (48.9 KB)

 ![Screenshot (17)](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/c/2c7b8df79292e4424812a03fef24ab48f704be95.png)

---

<div class="post-metadata">

**Author:** ![Jose\_Enrique\_Ogando](https://avatars.discourse-cdn.com/v4/letter/j/b5e925/32.png) [@Jose\_Enrique\_Ogando](https://forum.inductiveautomation.com/u/Jose_Enrique_Ogando)\
**Post date:** [May 1, 2024, 9:25pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/12 "2024-05-01T21:25:22Z")

</div>

Do you have a repository on GitHub to see the code and see how you did it?

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [May 14, 2024, 10:11am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/13 "2024-05-14T10:11:08Z")

</div>

MultiCalendar [github](https://github.com/ezattelli/MultiCalendar) repo

---

<div class="post-metadata">

**Author:** ![jasongrant15](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@jasongrant15](https://forum.inductiveautomation.com/u/jasongrant15)\
**Post date:** [July 5, 2024, 6:51pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/15 "2024-07-05T18:51:49Z")

</div>

Hi,

Is there a way to have the "DatePicker Range" view show like the calendar view... I.E. be up without having to click on the inputbox? It would be awesome for showing previously selected date ranges.

---

<div class="post-metadata">

**Author:** ![mdia](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mdia/32/87599_2.png) [@mdia](https://forum.inductiveautomation.com/u/mdia)\
**Post date:** [August 30, 2024, 6:19pm UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/16 "2024-08-30T18:19:50Z")

</div>

Adding an option to show the "DatePicker Range" view like a calendar object would be really helpful!

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [September 1, 2024, 5:24am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/17 "2024-09-01T05:24:11Z")

</div>

I am working on this

---

<div class="post-metadata">

**Author:** ![justin\_potter](https://avatars.discourse-cdn.com/v4/letter/j/ecc23a/32.png) [@justin\_potter](https://forum.inductiveautomation.com/u/justin_potter)\
**Post date:** [December 20, 2024, 2:21am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/18 "2024-12-20T02:21:06Z")

</div>

This tool is fantastic, especially the date range selector, which I’ve been hoping Ignition would make available as it already exists in the Power Chart range selector.

Here’s some feedback that could improve the tool and make it even more useful:

1. **Show Functionality:** Adding a "show" function would be great, allowing us to trigger the calendar popup with an icon (like a calendar icon) instead of requiring users to click the text field.
2. **Close Button:** A close button on the calendar popup would be helpful. While the current modal style that closes on click works well, it doesn’t always function in scenarios where another action is taken, such as interacting with a dropdown.
3. **Startup Date Population:** It would be intuitive if the `date:{start, end}` fields populated automatically on startup, displaying a default date or date range in the text field before any user interaction. Additionally, if these fields are updated via binding, it would be ideal for the values to update both the text field and the calendar popup range.

Thank you for this amazing tool, and I hope these suggestions are helpful!

---

<div class="post-metadata">

**Author:** ![Mehrdad\_Telli](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mehrdad_telli/32/77763_2.png) [@Mehrdad\_Telli](https://forum.inductiveautomation.com/u/Mehrdad_Telli)\
**Post date:** [February 23, 2025, 7:20am UTC](https://forum.inductiveautomation.com/t/multicalendar-module/86326/19 "2025-02-23T07:20:10Z")

</div>

Please try out this module, I think it will solve all your needs.

> **[vCortex (Visual Component Pack) for Ignition - i4cortex](https://i4cortex.com/product/vcortex-visual-component/)**
>
> vCortex (Visual Component Package) Module for Ignition Platform. The vCorex module is collection of Perspective components to fill the gap
