POC for having a hidden alt field that actually gets saved, separate …

…from the date display field.
gocodebox · Feb 25, 2025 · a945d5b · a945d5b
1 parent 8bcf24d
commit a945d5b
Show file tree

Hide file tree

Showing 2 changed files with 87 additions and 9 deletions.
diff --git a/assets/js/private/llms-metaboxes.js b/assets/js/private/llms-metaboxes.js
@@ -269,12 +269,16 @@
 		 */
 		this.bind_datepicker = function( $el ) {
 			var format  = $el.attr( 'data-format' ) || 'mm/dd/yy',
+				altFormat = $el.attr( 'data-alt-format' ) || '',
+				altField = $el.attr( 'data-alt-field' ) || '',
 				maxDate = $el.attr( 'data-max-date' ) || null,
 				minDate = $el.attr( 'data-min-date' ) || null;
 			$el.datepicker( {
 				dateFormat: format,
 				maxDate: maxDate,
 				minDate: minDate,
+				altField: altField,
+				altFormat: altFormat
 			} );
 		}
 

diff --git a/includes/admin/post-types/meta-boxes/fields/llms.class.meta.box.date.php b/includes/admin/post-types/meta-boxes/fields/llms.class.meta.box.date.php
@@ -31,15 +31,67 @@ public function __construct( $_field ) {
 		$_field = wp_parse_args(
 			$_field,
 			array(
-				'date_format' => 'mm/dd/yy', // jQuery datepicker formats (http://api.jqueryui.com/datepicker/#utility-formatDate).
-				'date_max'    => '',
-				'date_min'    => '',
+				'date_format'        => 'mm/dd/yy', // jQuery datepicker formats (http://api.jqueryui.com/datepicker/#utility-formatDate).
+				'date_max'           => '',
+				'date_min'           => '',
+				'date_displayformat' => $this->php_to_jquery_date_format( get_option( 'date_format' ) ),
 			)
 		);
 
 		$this->field = $_field;
 	}
 
+	function php_to_jquery_date_format( $php_format ) {
+		$replacements = array(
+			// Day
+			'd' => 'dd',
+			'D' => 'D',
+			'j' => 'd',
+			'l' => 'DD',
+			// Month
+			'm' => 'mm',
+			'n' => 'm',
+			'M' => 'M',
+			'F' => 'MM',
+			// Year
+			'Y' => 'yy',
+			'y' => 'y',
+		);
+
+		return strtr( $php_format, $replacements );
+	}
+
+	function jquery_date_to_php_format( $js_format ) {
+		// Mapping of jQuery UI Datepicker tokens to PHP date format tokens
+		$replacements = array(
+			// Year tokens
+			'yy' => 'Y',  // 4-digit year
+			'y'  => 'y',  // 2-digit year
+
+			// Month tokens
+			'mm' => 'm',  // Month with leading zero
+			'm'  => 'n',  // Month without leading zero
+			'MM' => 'F',  // Full month name
+			'M'  => 'M',  // Short month name
+
+			// Day tokens
+			'dd' => 'd',  // Day with leading zero
+			'd'  => 'j',  // Day without leading zero
+			'DD' => 'l',  // Full day name
+			'D'  => 'D',   // Short day name
+		);
+
+		// Sort keys descending by length to avoid partial replacements.
+		uksort(
+			$replacements,
+			function ( $a, $b ) {
+				return strlen( $b ) - strlen( $a );
+			}
+		);
+
+		return strtr( $js_format, $replacements );
+	}
+
 	/**
 	 * Construct data attributes for the field
 	 * sets up jQuery datepicker
@@ -79,22 +131,44 @@ public function output() {
 		global $post;
 
 		parent::output(); ?>
-
+		<?php
+		// Convert the meta value into display format.
+		$js_display_date = '';
+		if ( ! empty( $this->meta ) ) {
+			$meta_date       = DateTime::createFromFormat( $this->jquery_date_to_php_format( $this->field['date_format'] ), $this->meta );
+			$js_display_date = $meta_date->format( $this->jquery_date_to_php_format( $this->field['date_displayformat'] ) );
+		}
+		?>
+		<input type="hidden"
+				id="<?php echo esc_attr( $this->field['id'] ); ?>_alt_datefield"
+				name="<?php echo esc_attr( $this->field['id'] ); ?>"
+				value="<?php echo ! empty( $this->meta ) ? esc_attr( $this->meta ) : ''; ?>"
+			<?php if ( isset( $this->field['required'] ) && $this->field['required'] ) : ?>
+				required="required"
+			<?php endif; ?>
+		/>
 		<input type="text"
-			name="<?php echo esc_attr( $this->field['id'] ); ?>"
+			name="<?php echo esc_attr( $this->field['id'] ); ?>_datepicker"
 			id="<?php echo esc_attr( $this->field['id'] ); ?>"
 			class="<?php echo esc_attr( $this->field['class'] ); ?>"
-			value="<?php echo ! empty( $this->meta ) ? esc_attr( $this->meta ) : ''; ?>"
+			value="<?php echo ! empty( $this->meta ) ? esc_attr( $js_display_date ) : ''; ?>"
 			size="30"
 			<?php if ( isset( $this->field['required'] ) && $this->field['required'] ) : ?>
 			required="required"
 			<?php endif; ?>
 			<?php if ( isset( $this->field['placeholder'] ) ) : ?>
 			placeholder="<?php echo esc_attr( $this->field['placeholder'] ); ?>"
 			<?php endif; ?>
-			<?php
-				echo wp_kses_post( $this->get_data_attrs() );
-				?>
+			data-format="<?php echo esc_attr( $this->field['date_displayformat'] ); ?>"
+			data-alt-format="<?php echo esc_attr( $this->field['date_format'] ); ?>"
+			<?php if ( ! empty( $this->field['date_max'] ) ) : ?>
+				data-max-date="<?php echo esc_attr( $this->field['date_max'] ); ?>"
+			<?php endif; ?>
+			<?php if ( ! empty( $this->field['date_min'] ) ) : ?>
+				data-min-date="<?php echo esc_attr( $this->field['date_min'] ); ?>"
+			<?php endif; ?>
+			data-alt-field="#<?php echo esc_attr( $this->field['id'] ); ?>_alt_datefield"
+
 		/>
 		<?php
 		parent::close_output();