Convert a PHP date format to a jQueryUI Datepicker

Question

[EDIT] : I guess people had problem to understand exactly what I mean, so I completely rewrote my explanations.

I work on a project where users can define a date format used in the whole site. It uses PHP date format standard. For example : "year-month-day" is set by "Y-m-d".

PHP standard uses single-character symbols like Y, m, d, F, j to describe the date format. As seen in the documentation : http://www.php.net/manual/fr/function.date.php

Sometimes users can select a date thanks to a jQueryUI Datepicker. This component describes its date format with code-words like yy, y, mm, dd, D, ... http://api.jqueryui.com/datepicker/#utility-formatDate

I would like to display the dates in the same format for both PHP and the Datepicker. I mean that PHP should output the date as in the format set by user, AND the Datepicker should show the selected date in the same format.

Given that:

1. The date format is necessarily described "PHP style"
2. I can't know a priori which format was set by users

/!\ This not a problem of how to read/parse/display a date from a known format.

Unfortunately, Javascript date format description is not the same as in PHP. For instance, these 2 date formats are equivalent but described differently in PHP and Javascript:

1. PHP : Y-m-d (set by users)
2. Javascript : yy-mm-dd

As you can see, I cannot just configure the datepicker with the PHP date format, because it will be misunderstood, or not recognized at all.

Someone (in answers below) adviced to create my own "date format standard converter", matching each PHP symbol with its equivalent in JS date format description. Just like:

• Y => yy
• m => mm
• d => dd
• y => y
• z => o
• ...

And then replace each PHP symbol with the JS one. And so "d/m/Y" will be translated into "dd/mm/yy", magically.

But maybe somebody knows another proper way to make jQueryUI Datepicker understand PHP date format standard?

EDIT: I wrote a tutorial that explains both the problem and the solution. For further reading : http://tristan-jahier.fr/blog/2013/08/convertir-un-format-de-date-php-en-format-de-date-jqueryui-datepicker

Answer 1

Here is the solution:

function datepicker_format($format) {
        static $assoc = array(
            'Y' => 'yyyy',
            'y' => 'yy',
            'F' => 'MM',
            'm' => 'mm',
            'l' => 'DD',
            'd' => 'dd',
            'D' => 'D',
            'j' => 'd',
            'M' => 'M',
            'n' => 'm',
            'z' => 'o',
            'N' => '',
            'S' => '',
            'w' => '',
            'W' => '',
            't' => '',
            'L' => '',
            'o' => '',
            'a' => '',
            'A' => '',
            'B' => '',
            'g' => '',
            'G' => '',
            'h' => '',
            'H' => '',
            'i' => '',
            's' => '',
            'u' => ''
        );

        $keys = array_keys($assoc);

        $indeces = array_map(function($index) {
            return '{{' . $index . '}}';
        }, array_keys($keys));

        $format = str_replace($keys, $indeces, $format);

        return str_replace($indeces, $assoc, $format);
    }

The magic double str_replace call caused by duplicating in needles and its replacement values, so that's why the string

m/d/Y 

becomes

{{3}}/{{5}}/{{1}}

and after that this nests replacing with actual replacement values:

mm/dd/yy

Answer 2

You cannot use the same format with datepicker that you're using with PHP.

Since PHP's date format only uses single letter codes, you're better off just taking the PHP date format and replacing each code to the corresponding value in the jQuery datepicker format, e.g.:

$PHPFormatOptions = array('y', 'Y', 'm', 'd');
$JSFormatOptions = array('yy', 'yyyy', 'mm', 'dd'); // and so on
$JSFormat = str_replace($PHPFormatOptions, $JSFormatOptions, $PHPFormat);

Answer 3

Ok so the best solution for you would be to store everything in your website using time();

As far as I know datepicker can be set to work with dates for PHP timestamp

dateFormat : 'yy-mm-dd',

Edit :

Why would you store a date like : Y-m-d ? It should be stored as timestamp or int

Answer 4

Not sure I'm quite with you, but this really shouldn't be an issue. You could either parse the front-end input: using DateTime::createFromFormat cf. php documentation for this, or use JSON.
Since JSON has an accepted standard way of formatting date strings, you can pass a JSON-stringified version of the input date to PHP, and json_decode it server-side. Both of these solutions are open to you, though I believe the first one to be easier to implement in your case.

If you want to be able to choose the format on both sides, the DateTime object is definitely what you need:

$date = new DateTime();
echo $date->format('Y-m-d').' <==> '.$date->format('y-M-j');
$postDate = $date->createFromFormat('y-m-d',$_POST['submitDate']);
echo $postDate->format('Y-m-d');

The format is explained on the page I've linked to.

Answer 5

I chose the brutal method : converting symbol-by-symbol the date format. I made a 'not-so-dummy' code snippet.

/*
 * Matches each symbol of PHP date format standard
 * with jQuery equivalent codeword
 * @author Tristan Jahier
 */
function dateformat_PHP_to_jQueryUI($php_format)
{
    $SYMBOLS_MATCHING = array(
        // Day
        'd' => 'dd',
        'D' => 'D',
        'j' => 'd',
        'l' => 'DD',
        'N' => '',
        'S' => '',
        'w' => '',
        'z' => 'o',
        // Week
        'W' => '',
        // Month
        'F' => 'MM',
        'm' => 'mm',
        'M' => 'M',
        'n' => 'm',
        't' => '',
        // Year
        'L' => '',
        'o' => '',
        'Y' => 'yy',
        'y' => 'y',
        // Time
        'a' => '',
        'A' => '',
        'B' => '',
        'g' => '',
        'G' => '',
        'h' => '',
        'H' => '',
        'i' => '',
        's' => '',
        'u' => ''
    );
    $jqueryui_format = "";
    $escaping = false;
    for($i = 0; $i < strlen($php_format); $i++)
    {
        $char = $php_format[$i];
        if($char === '\\') // PHP date format escaping character
        {
            $i++;
            if($escaping) $jqueryui_format .= $php_format[$i];
            else $jqueryui_format .= '\'' . $php_format[$i];
            $escaping = true;
        }
        else
        {
            if($escaping) { $jqueryui_format .= "'"; $escaping = false; }
            if(isset($SYMBOLS_MATCHING[$char]))
                $jqueryui_format .= $SYMBOLS_MATCHING[$char];
            else
                $jqueryui_format .= $char;
        }
    }
    return $jqueryui_format;
}

This function handles all the common codewords between PHP and Datepicker date format standards.

Plus, I added support for character escaping :

d m \o\f Y becomes dd mm 'of' yy

You may still have problems with symbols like 'W', 'L' that have no equivalent handled by Datepicker.