Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Convert a PHP date format to a jQueryUI Datepicker date format

[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/en/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

like image 987
Tristan Jahier Avatar asked May 22 '13 22:05

Tristan Jahier


People also ask

How do I change date picker format?

Do one of the following: For a text box control or a date picker control, ensure that the Data type list displays the appropriate data type, and then click Format. For an expression box control, ensure that the Format as list displays the appropriate data type, and then click Format.

How can I change the date format in PHP?

Change YYYY-MM-DD to DD-MM-YYYY In the below example, we have date 2019-09-15 in YYYY-MM-DD format, and we will convert this to 15-09-2019 in DD-MM-YYYY format. $orgDate = "2019-09-15"; $newDate = date("d-m-Y", strtotime($orgDate)); echo "New date format is: ".

How can change date format in jQuery ui datepicker?

inside the jQuery script code just paste the code. $( ". selector" ). datepicker({ dateFormat: 'yy-mm-dd' });

How do I change the date format from YYYY-MM-DD in jQuery?

Re: convert Date from YYYY-MM-DD to MM/DD/YYYY in jQuery/JavaScript. var tempDate = new Date("2021-09-21"); var formattedDate = [tempDate. getMonth() + 1, tempDate.


1 Answers

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.

like image 107
Tristan Jahier Avatar answered Sep 30 '22 20:09

Tristan Jahier