Forum Discussion

SeanOBrien1's avatar
SeanOBrien1
Community Member
11 days ago

Date Picker

Hello All, I have searched high and low for a solution to adding a Date Picker Field to a Storyline 360 course. I found some discussions that are 9 years old and they all involve Web Objects. The only problem is I cannot figure out how to test a Web Object that is a Local html file in Review 360. 

There isnt a pure Java version of this I can find. I cannot believe this isnt a standard input for Storyline in all this time.

Does anyone have a NEW solution to this that is not already out there?

  • SeanOBrien1's avatar
    SeanOBrien1
    Community Member

    And while I am at it.. Why doen't the text input filed allow for MASKS and a fail trigger natively. 

  • Nedim's avatar
    Nedim
    Community Member

    You can use a text entry field in Storyline and convert it to a date format, or consider integrating a library like Flatpickr. Below are some examples to illustrate both approaches. Please note that these solutions involve using JavaScript.

    • SeanOBrien1's avatar
      SeanOBrien1
      Community Member

      Thank you for this, however have you actually used this in a storyline title?  If you have could you provide a sample. This is the information I found researching it's use with storyline. 

      Integrating flatpickr directly into Articulate Storyline 360 is challenging due to Storyline's limited support for external JavaScript libraries. While flatpickr is an excellent tool for web applications, embedding it into Storyline slides without using web objects isn't straightforward. Developers often resort to custom interactions within Storyline or utilize web objects to incorporate such functionalities.

  • Nedim's avatar
    Nedim
    Community Member

    Both examples are implemented directly within Storyline, without using a WebObject to integrate Flatpickr. I actually prefer using Flatpickr over Storyline's native text entry field because it provides a more user-friendly and flexible date picker. Additionally, you can easily switch themes by simply changing the name of the imported theme CSS.

    • SeanOBrien1's avatar
      SeanOBrien1
      Community Member

      This is awesome Nedin. Thank you for the prompt reply. I will test this when I get home.