wip datepicker js part is done, it creates a hidden field with date in acf format

This commit is contained in:
asus
2024-04-21 21:05:26 +02:00
parent 51097aa0de
commit 5553c78b21
2 changed files with 28 additions and 25 deletions

View File

@@ -1,31 +1,34 @@
//let datepicker_wrapper = document.querySelector(".datepicker-wrapper");
//console.log("datepicker-wrapper: ", datepicker_wrapper);
//
//let mydate = document.createElement("input");
//mydate.setAttribute('type', 'text');
//mydate.setAttribute('style', 'margin-top:10px;');
//datepicker_wrapper.appendChild(mydate);
//
//console.log("mydate: ", mydate);
//mydate.value = "oups";
//
//$(mydate).datepicker({dateFormat: "yymmdd",});
/*
* overriding the datepicker function to intercept the arguments
* -> https://stackoverflow.com/questions/26667720/how-to-get-the-selected-date-from-jquery-datepicker
* then create an hidden input with the date in acf format 'yymmdd'
*
*/
// Store the original jQuery UI datepicker function
const originalDatepicker = jQuery.fn.datepicker;
// store the original jQuery UI datepicker function
const original_datepicker = jQuery.fn.datepicker;
// override the datepicker function
jQuery.fn.datepicker = function(options) {
// Log the function call and its arguments
console.log('Datepicker function is called with options:', options);
options.onSelect = function(date_text, inst) {
const acf_date_format = "yymmdd";
const selected_date = jQuery(this).datepicker('getDate');
const formated_date = jQuery.datepicker.formatDate(acf_date_format, selected_date);
// Call the original datepicker function with the same arguments
return originalDatepicker.call(this, options);
const instance_element = document.getElementById(inst.id);
console.log("instance_element:", instance_element);
const hidden_field_id = inst.id + '_acf_date_hidden';
if (document.getElementById(hidden_field_id) === null) {
var acf_date = document.createElement("input");
acf_date.setAttribute('type', 'hidden');
acf_date.setAttribute('id', hidden_field_id);
acf_date.setAttribute('name', 'acf_date_hidden_for_' + instance_element.name);
instance_element.insertAdjacentElement('afterend', acf_date, acf_date);
}
else {
var acf_date = document.getElementById(hidden_field_id);
}
acf_date.value = formated_date;
}
// call the original datepicker function with the updated option
return original_datepicker.call(this, options);
};

View File

@@ -27,7 +27,7 @@ if (!defined('ABSPATH')) {
../../../../wordpress_docker/volumes/wp_volume/wp-content/plugins/divi-form-builder/scripts/builder-bundle.min.js
jquery date picker :
7509 : ../../../../wordpress_docker/volumes/wp-volumes/wp-content/plugins/divi-form-builder/includes/modules/FormField/FormField.php
7509 : wordpress_docker/volumes/wp-volumes/wp-content/plugins/divi-form-builder/includes/modules/FormField/FormField.php
*/