Page 1 of 1

Date Control Format

Posted: 01 Jan 2019
by CW
Hello. Pardon my naivety, I'm not very fluent in JS AT ALL. I've done a couple of alerts in my time but......... :oops:

From the attached image you can see I have a couple of date fields; date from date to. All I want is to display dates as "Tuesday, January 1, 2019" or even "2019-01-01" instead of the default date picker, which to me is not very intuitive.

I see the Javascript for my field being "

Code: Select all

fd.field(fieldName).control()._el().append("<p>Custom rendering</p>");
" but can't change it.

Would I just add

Code: Select all

fd.field(fieldName).control()._el().append("<p>yyyy/mm/dd</p>"
in the Javascript popup window? :?

Re: Date Control Format

Posted: 04 Jan 2019
by AlexZver
Hi!

We are working on your issue and soon will give you an answer.

Re: Date Control Format

Posted: 10 Jan 2019
by AlexZver
Hi!

I'm sorry for a late reply. In fact, you do not need to use custom rendering, just format the output date.

There is a ready-made solution for your case. Try Moment.js.

To launch it on Sharepoint you should download two .js files from the site and upload them in the document library (Site Assets, for example).

A code will be like this:

Code: Select all

window.define = null;
$.getScript("/sites/YourSiteName/SiteAssets/moment-with-locales.min.js")
    .then(function () { return $.getScript("/sites/YourSiteName/SiteAssets/moment-with-locales.min.js") })
    .then(function () {
        
        function setDate() {
            window.date = fd.field("Date").control('getDate');
            var newFormatDate = moment(date).format('dddd, MMMM Do, YYYY');
            fd.field("Date").value(newFormatDate);
        }

        setDate();

        fd.field('Date').change(setDate);

        fd.onsubmit(function () {
            fd.field('Date').value(date);
            return true;
        });

    })
Please do not forget to specify a correct URLs for Moment.js files and replace 'Date' with the internal name of your date field.