Jump to content

how to format the datetime pickup widget ?


adrianmak
 Share

Recommended Posts

When you edit your field, below Input you can find the Date Input Format. Normally you'd set that to Y-m-d or d-m-Y if you use it at all.

However, when you set it to m-Y or Y-m then the day will not be saved in the field. Unfortunately, the picker itself won't change to reflect this behaviour. You also still have to click on the day to update the field itself. I'm not aware of methods to change the picker itself without changing it's code.

Link to comment
Share on other sites

On 3/6/2018 at 6:58 PM, matjazp said:

It's doable with datepicker

I just use a Text field with a regex pattern for validation: ^(20\d{2}|19\d{2}|0(?!0)\d|[1-9]\d)-(1[0-2]|0[1-9]|\d)$ for dates like 2018-01

I think pressing 7 keys to specify the month is a lot faster than fiddling with a datepicker.

  • Like 1
Link to comment
Share on other sites

9 hours ago, szabesz said:

I just use a Text field with a regex pattern for validation: ^(20\d{2}|19\d{2}|0(?!0)\d|[1-9]\d)-(1[0-2]|0[1-9]|\d)$ for dates like 2018-01

I think pressing 7 keys to specify the month is a lot faster than fiddling with a datepicker.

could i customize the error message if a pattern is mismatch?

Link to comment
Share on other sites

3 hours ago, adrianmak said:

could i customize the error message if a pattern is mismatch?

I guess it cannot be changed because it is coming from the browser, eg this is my output in the page source:

<input id="Inputfield_example_textfield" class="InputfieldMaxWidth" name="expense_example_textfield" value="2018-01" type="text" maxlength="7" pattern="^(20\d{2}|19\d{2}|0(?!0)\d|[1-9]\d)-(1[0-2]|0[1-9]|\d)$" data-minlength="6" tabindex="5">

So I wrote short instructions into the Notes property (that appears beneath the input) of the Field. Eg: Date fomat (year-month): 2018-01

Link to comment
Share on other sites

  • 4 weeks later...

Why not...

  • make a Template for months with a title (Januari-December) and index (1-12) field. Then make 12 pages with this template representing each month.
  • make a Field (month) of the Page type. Configure it to accept only 1 choice of the template we made for the month. Voila, a translatable month picker!
  • make a Field (year) which can be an Integer with a minimum and maximum value of your choice.

This way you are 100% sure that the input of your client is clean without having to mess with a regex. The downside is that it requires two fields instead of one, and some data management. I find that permissable as you explicitly don't want to store a full datetime. You could configure the template that contains these Fields to display them next to another at 50% width to show the user their intent to be used together. Consider making these fields required.

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...