Formatting date and time variables | FB_019

Variables can be created to accept data in specified date and time formats, rather than simply the free input of text. When doing this, it is important to specify the exact required format for these inputs.

When working with an entire field in your MegaEdit product, this is quite simple, however what happens if we need to apply that exact formatting when the date and time are input as variables within one field?

This tutorial will walk us through this process.

This tutorial assumes some prior knowledge in the configuration of fields and variables in the Infigo Form Builder.

  1. 1. Create your variables and input them into your MegaEdit product

    Following instructions from other Academy tutorials, create and configure a couple of basic variables within the script config. Once done, place these variables into a text field on your MegaEdit canvas.

    Create your variables and input them into your MegaEdit product

  2. 2. Utilise a date field to obtain the required tags

    The easiest way to obtain the correct format of tag for your variable is actually by utilising an entire field dedicated to date input.

    Utilise a date field to obtain the required tags

  3. 3. Change the date formatting to your required format

    Change the date formatting to your required format

  4. 4. As you change the date format, a field tag will be created detailing that format. Copy down this information as we will later input it into our variable.

    As you change the date format, a field tag will be created detailing that format. Copy down this information as we will later input it into our variable.

  5. 5. Repeat the process for a dedicated time field

    Repeat the process for a dedicated time field

  6. 6. Change the format of the time shown in this field in order to create a relevant field tag

    Change the format of the time shown in this field in order to create a relevant field tag

  7. 7. Copy this field tag down for later use, as we will use it in our variable

    Copy this field tag down for later use, as we will use it in our variable

  8. 8. Navigate to your script config either on the product or global level (wherever you created the basic variables)

    Navigate to your script config either on the product or global level (wherever you created the basic variables)

  9. 9. Modify the 'input' line

    For a variable containing date information, input "DateField". This will enable the use of these additional formatting tags

    Modify the 'input' line

  10. 10. Add a new line to your variable configuration named "tags". Input the Date field tag information you copied down, ensuring the correct format as seen here. tags: ['DateFieldFormat_MMMM-dd-yyyy;true']

    Add a new line to your variable configuration named "tags". Input the Date field tag information you copied down, ensuring the correct format as seen here. tags: ['DateFieldFormat_MMMM-dd-yyyy;true']

  11. 11. For the Time variable, first modify the "input" line

    For a variable containing time information, input "TimeField". This will enable the use of these additional formatting tags.

    For the Time variable, first modify the "input" line

  12. 12. Add a new line to your variable configuration named "tags". Input the Time field tag information you copied down, ensuring the correct format as seen here. tags: ['TimeFieldConfig_5;15']

    Add a new line to your variable configuration named "tags". Input the Time field tag information you copied down, ensuring the correct format as seen here. tags: ['TimeFieldConfig_5;15']

  13. 13. Click on Save and Continue Edit

    Click on Save and Continue Edit

  14. 14. Refresh your MegaEdit product to see these updated variables in action

    Refresh your MegaEdit product to see these updated variables in action

  15. 15. The date and time can be changed within the main user-facing form, with the information updated in the relevant field containing both associated variables.

    The date and time can be changed within the main user-facing form, with the information updated in the relevant field containing both associated variables.