Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Chris Smith 38 posts 141 karma points
    Aug 18, 2017 @ 09:57
    Chris Smith
    0

    Changing the date picker format

    Hi.

    I'm wondering if there is a way to change the acceptable format of the date picker in a form when you type a date into the textbox rather than using the calendar to select a date.

    At the moment you have to enter a date in the following format,

    enter image description here

    So you have to type in the actual name of the month, this seems fairly unintuitive as you can usually enter a date in a (UK) format such as 31/12/1999 or 31-12-1999 however when you try this the date field changes the input to

    enter image description here

    The local culture of the site is set to UK English and I've tried the solution in https://our.umbraco.org/forum/umbraco-pro/contour/61213-Umbraco-Forms-Pikaday-Moment-working but it doesn't seem to work in this instance.

    Does anyone know of a work around?

    Cheers

    Chris

  • Bas Schouten 135 posts 233 karma points
    Oct 26, 2017 @ 14:53
    Bas Schouten
    0

    Hi Chris,

    Did you find any solution for this problem? We are struggling with the same issue

  • Chris Smith 38 posts 141 karma points
    Oct 26, 2017 @ 15:14
    Chris Smith
    0

    Hi Bas.

    Unfortunately I didn't.

  • Katie 25 posts 90 karma points
    Dec 06, 2017 @ 08:50
    Katie
    104

    I have followed the instructions in here - https://our.umbraco.org/forum/umbraco-pro/contour/61213-Umbraco-Forms-Pikaday-Moment-working, which did not work. I then edited the settings in \Views\Partials\Forms\DatePicker.cshtml and updated the format.

    $(".datepickerfield")
            .each(function () {
                var currentId = this.id;
                new Pikaday({
                    field: document.getElementById(currentId),
                    yearRange: "@datePickerYearRange",
                    i18n: locales.default,
                    format: "DD/MM/YYYY",
                    onSelect: function (date) {
                        setShadow(currentId.replace("_1", ""), date);
                    }
                });
            });
    

    This has worked perfectly. As mine was for a date of birth, I also updated the datePickerYearRange in the UmbracoForms.config to 100, so the year could easily be selected.

  • Chris Smith 38 posts 141 karma points
    Dec 06, 2017 @ 10:01
    Chris Smith
    0

    Thanks for sharing your solution Katie, I'm now rolling it out across our sites with Forms installed. : )

  • Allan 42 posts 192 karma points
    Aug 07, 2018 @ 11:05
    Allan
    0

    Katie's post does fix things on the surface, but I found even if you change all of the values you still get the date in an incorrect format inside the form.

    My birthday is 27th February 1975 (yes... I am really old!)

    If I put this into a datepicker having changed the details using Katie's fix everything appears fine, but when I view that date in the Umbraco Forms section I get this...

    2/27/1975 - For us UK bods that's very wrong!

    If you hop to https://momentjs.com/ you can see that the original value of the format was 'LL' which basically sets the date value to the current culture...

    ... by default the culture for english is set to U.S. and THAT is why the date is all mixed and wrong!

    FIX:-

    • Umbraco Settings > Languages > Add UK
    • Root node > Do Something Else > Culture and Host names
    • Set to 'en-gb'
    • If you are feeling really crazy set the 'umbracoDefaultUILanguage' to 'en-GB
    • You should be all set!

    Hope I am not stepping on Katie's toes... I 'High Fived' her because without her solution I would not have got to mine!

Please Sign in or register to post replies

Write your reply to:

Draft