[Resolved] Add Default value for date field in admin

[Author]

Posts

[zeljko-turkaljS]

I have created 'posting' CPT and (among others) 'Sold Expiration Date' custom field of type Date in it.

I want to programmatically populate 'Sold Expiration Date' using javascript when creating new or editing posts of that CPT in WP backend. I don't use CRED. I'm aware of the approach explained in this https://toolset.com/forums/topic/how-to-set-default-value-for-post-field-field-type-date thread, but it doesn't fit my needs, because I have to modify this date based on the value of other custom fields, so I need to use JS.

This is what have I done so far: I'm hooking on admin_enqueue_scripts, then check if I'm editing or posting new 'posting' and then enqueue this JS:

jQuery( document ).ready( function( $ ) {
// date format: April 20, 2021
var dateOptions = { year: 'numeric', month: 'long', day: 'numeric' };

const currentTimestamp = Date.now();
const expirationTimestamp = new Date(currentTimestamp + 2629743000 * 12); // now + 12 months

$('input[name="wpcf[sold-expiration-date][display-only]"]').val( expirationTimestamp.toLocaleString('en-US', dateOptions) );
$('input[name="wpcf[sold-expiration-date][datepicker]"]').val( Date.parse(expirationTimestamp) );
} );

It works as expected, when saving the post wpcf-sold-expiration-date option is populated with the timestamp, but the field 'Sold Expiration Date' remains empty, so I obviously missed some step to properly submit the field. Can you tell me what am I missing?

Best regards,
Petar

[Minesh]

Hello. Thank you for contacting the Toolset support.

Can you please try to add the following line of the code at last within your code:

$( 'input[name="wpcf[sold-expiration-date][display-only]"]').datepicker({ defaultDate: expirationTimestamp.toLocaleString('en-US', dateOptions) });

I hope the above solution will help you to resolve your issue.

[zeljko-turkaljS]

Hi Minesh,

unfortunately, it didn't help. This line even removes 'Select date' image next to input.

[Minesh]

The thing is that its hard to replace the existing date field.

Can you please share problem URL and admin access details and tell me where exactly you added the code you shared?

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

[Minesh]

I'm not sure but please check the following screenshot: hidden link

I can see date field is filled with date value and date picker icon is also displayed.

[zeljko-turkaljS]

Yes, that's true. Now try to save that post (you'll have to fill up some mandatory fields) and after reload, date will be empty 🙁

[Minesh]

Can you please check now.

I've created the following test post: hidden link

And once I publish that, I can see the date field value remains populated now.

I've adjusted the JS code as given under:

jQuery( document ).ready( function( $ ) {
    // $() will work as an alias for jQuery() inside of this function

    // hide Sold Expiration Date
    // $('div[data-wpt-id="wpcf-sold-expiration-date"]').hide();

    // date format: April 20, 2021

    var dateOptions = { year: 'numeric', month: 'long', day: 'numeric' };
	
	

    const currentTimestamp = Date.now();
    const expirationTimestamp = new Date(currentTimestamp + 2629743000 * 12);  // now + 12 months


var urlParams = new URLSearchParams(window.location.search); //get all parameters
var posttype = urlParams.get('post_type'); //extract the foo parameter - this will return NULL if foo isn't a parameter

	if(posttype) { 

			$('input[name="wpcf[sold-expiration-date][display-only]"]').val( expirationTimestamp.toLocaleString('en-US', dateOptions) );
			ts = Date.parse(expirationTimestamp)/1000;
			$('input[name="wpcf[sold-expiration-date][datepicker]"]').val( ts );
	}
    //$('input[name="wpcf[sold-expiration-date][datepicker]"]').val( Date.parse(expirationTimestamp) );
	
    // $('input[name="wpcf[sold-expiration-date][display-only]"]').datepicker({ defaultDate: expirationTimestamp.toLocaleString('en-US', dateOptions) });

} );

[zeljko-turkaljS]

It works 🙂

So, you are basicaly executing the code for filling the date field only when the new post is being created, have I got that right?

Thank you very much for the quick assistence!

[Minesh]

So, you are basicaly executing the code for filling the date field only when the new post is being created, have I got that right?
==>
Yes, that's correct 🙂

[zeljko-turkaljS]

My issue is resolved now. Thank you!