[Resolved] CRED datepicker default format

[Author]

Posts

[michaelB-31]

Hi,

Really short question, but I found so much conflicting and outdated information in the forum... so I decided to simply ask:

How can I change the format of the date shown on the datepicker field? Default format is "F j, Y" (e.g. "September 21, 2017").

How can I change that to for example "d.m.Y" (e.g. "21.09.2017")?

Thank you very much and best regards,
Michael

[Luo Yang]

Dear Michael,

You are right, we have already extended the supported date format to below:
[F j, Y] [Y/m/d] [m/d/Y] [d/m/Y] [d/m/y] [Y/n/j] [d.m.Y] [j.n.Y] [Y-m-d] [j F Y]

And the format "d.m.Y" is in the list, so you can try this:
Dashboard-> Settings-> General
option "Date Format", setup as: d.m.Y, and test again.

[michaelB-31]

Thank you very much for your fast answer!

Yes, that worked. But: Is there a way to only change the date format for the datepicker directly? Because on the rest of the website (for example the date for blog posts) I'd still like to have the "readable" format "j. F Y" (21. September 2017). Only for the datepicker I need the 21.09.2017 format.

Thanks and best regards,
Michael

[Luo Yang]

I assume you are using the CRED shortcode [cred_field] to display the custom date field in the CRED form, see our document:
https://toolset.com/documentation/user-guides/cred-shortcodes/#cred_field
There isn't such an option can specific the date format, so there isn't such a built-in feature within CRED plugin that can do what you want.

If you agree, we can take it as a feature request.

[michaelB-31]

Thanks again for your answer.

Ok, I see. Yes, I use the [cred_field] shortcode. If this feature request makes sense, of course, please consider it.

I also found this thread with a jQuery solution: https://toolset.com/forums/topic/change-default-datepicker-date-in-cred/

I tried to customize it for this case, but I couldn't make it work:

jQuery(window).bind("load", function() {
   jQuery('input[name="wpcf-datum[display-only]"').datepicker( "option", "dateFormat", "dd.mm.yy" );
});

Is that not possible or is there something wrong with the code?

Best regards,
Michael

[Luo Yang]

That thread is outdated and it won't be able to work, and it is for setup the date range of the custom date field, I just tested it in my localhost, it does not work at all for setting the date range.

You can trigger the event after document is ready, for example:

jQuery( document ).ready(function($) {
   
   jQuery(".js-wpt-date").datepicker({ 
   dateFormat: 'd.mm.yy'
   });

});

And it is only an example, and it is not a built-in feature of CRE plugin, so there is limitation on supporting it, you will need to customize it to what you want.

[michaelB-31]

I understand, this will definitely help finding the right solution.

Thanks a lot for your help!

Best regards,
Michael

[robertM-17]

This is a great 'suggestion'! I wanted to comment to just say that it works and the other information is really complicated and out of date. This is simple as a way to get a datepicker in CRED it seems.

1) design the form with dates fields

2) put that code from above, now below in the JS editor on the 'post form' edit page. And it seems to work,

There are probably more efficient ways including custom.js and functions.php and child themes. But this was a simplest implementation.

(Is there a more efficient place to put this rather than in the individual form JS Editor? )

Thanks for the most supportive bit of un-support!. I spent ages looking of 'cred datepicker' , that not about re-styling or changing defaults, just to get one working on the form.

jQuery( document ).ready(function($) {
    
   jQuery(".js-wpt-date").datepicker({ 
   dateFormat: 'd.mm.yy'
   });
 
});