Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Date elements: implement date format selection #1

Open
raspime opened this issue Oct 22, 2015 · 16 comments
Open

Date elements: implement date format selection #1

raspime opened this issue Oct 22, 2015 · 16 comments

Comments

@raspime
Copy link

raspime commented Oct 22, 2015

For Date fields it often is useful to have the input validated in the local format. So DD.MM.YYYY instead of the US format.
Is there a way to adjust this already?

@avbdr
Copy link
Owner

avbdr commented Oct 22, 2015

you can change this behavoir with attributes. "pattern" => "\d{2}.\d{2}.\d{4}", "placeholder" => "DD.MM.YYYY".

But i think its good to implement presets for this. Lets keep this issue opened.

@avbdr avbdr changed the title Date fields localized? Date elements: implement date format selection Oct 22, 2015
@raspime
Copy link
Author

raspime commented Oct 22, 2015

Thanks for this hint.
I could not find such in documentation.
Did I miss something? Where do I have to look for?
Or simply just in work?

Ooops - sorry. I closed it? Please re-open again.

@raspime raspime closed this as completed Oct 22, 2015
@avbdr
Copy link
Owner

avbdr commented Oct 22, 2015

one more good point. i need to cover that in the documentation

@avbdr avbdr reopened this Oct 22, 2015
@raspime
Copy link
Author

raspime commented Oct 23, 2015

I now did use these patterns. And the field shows (and only accepts) the correct format as input according to the pattern provided.
But the validation still checks for US format.
--> Error: The Geburtsdatum field must match the following date format: YYYY-MM-DD (e.g. 2015-10-23)
--> the field input is: 23.10.1962 (which is also written when using the calendar)

I checked the date validation script which uses RegExp according to the provided pattern attribut.

But: the form field "Date" re-formats the date into US format after submit (seen in the POST values). So according to my understanding the RegExp shall not use the pattern attribute provided but use the standard US format.

Could you please have a look to this?
Thanks.

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

can you please reset your session/change form id and try again? I just tried to reproduce and cant reproduce that.

    $form = Form::open ("test", $values, ['view' => "SideBySide$version"]);
    Form::Hidden ("id");
    Form::Date ("Date", "data", ["pattern" => "\d{2}.\d{2}.\d{4}", "placeholder" => "DD.MM.YYYY"]);
    Form::Button('GO','submit');
    $form->close ();
    echo '<hr>';

@raspime
Copy link
Author

raspime commented Oct 24, 2015

Hmmmm.
I tried again but still the same.

I am using this field definition:

Form::Date ("Geburtsdatum:", "gebdat", array("required" => 1, 
    "shortDesc" => "Bitte das Eingabeformat beachten.",
    "pattern" => "\d{2}.\d{2}.\d{4}",
    "placeholder" => "TT.MM.JJJJ",
    "title" => "TT.MM.JJJJ  (Beispiel: 11.05.1975)"));

This is what I receive after submit:
echo $_POST["gebdat"]; ==> 1965-10-23

this is your Element\Date - Script
(which I changed after my findings)

    public function render() {
// your code:
        //$this->validation[] = new Validation_RegExp("/" . $this->_attributes["pattern"] . "/", "Error: The %element% field must match the following date format: " . $this->_attributes["pattern"]);
// my change:
        $this->validation[] = new Validation_RegExp("/^\d{4}-\d{2}-\d{2}$/", "Error: The %element% field must match the following date format: " . $this->_attributes["title"]);
        parent::render();
    }

The original syntax did not work for me as the POST value always return YYYY-MM-DD.
Of course, the validation shows the correct behavor. It asks the user to input DD.MM.YYYY

I do not know if any browser returns the date value this way.
So it might be an idea to check for the returned value before validating it.

Could you reproduce this too?

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

oh, i thought that validation were failing. let me see the value.

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

in firefox + your element configuration im getting a valid status with a value '01.01.2001'.
in chrome im getting a prompt to enter date in mm/dd/yyyy format according to my locale set.

After googling it seems that it is impossible to specify chrome what date format to use, it will always fallback to a format what locale locale will specify.

So it seems that you need to stick with a Textbox field to get 100% working code with EU format instead of date

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

i think a way to is to change type=date to type=input as in reality only chrome 'supports' it.

diff --git a/PFBC/Element/Date.php b/PFBC/Element/Date.php
index 45ed2f0..89e027f 100644
--- a/PFBC/Element/Date.php
+++ b/PFBC/Element/Date.php
@@ -1,7 +1,7 @@
 <?php
 class Element_Date extends Element_Textbox {
        protected $_attributes = array(
-               "type" => "date",
+               "type" => "text",
                "pattern" => "\d{4}-\d{2}-\d{2}"
        );

@raspime
Copy link
Author

raspime commented Oct 24, 2015

Ooops - now you were quicker than me...
Unfortunately it does not look that chrome is the only one.

Using a text field input was my first thought too.
But then I am missing the features of HTML5 date fields where browser show either calender (MS edge, Android) or help for input (Chrome, FF, Edge)

So I again checked browsers and I agree that FF returns DD.MM.YYYY (according to
a) the pattern or really
b) the locale
but MS Edge also return US format. So I cannot tell for sure which browser returns what.
And in case you are right by telling it returns "locale" settings (which I could not test yet) than it might be more difficult.

But that's why I am thinking it would be a good idea to implement a switch before validating into the date-element.
Something like: if a dot in the string - validate acc. to EU / if a - then use US format validation

Or try to reformat the POST value in a way like: input2date()$_POST["date"]

@raspime
Copy link
Author

raspime commented Oct 24, 2015

I now also was trying your recommendation to change field to text.
This way the validation works fine - but as said I am now missing the browser's assistance tools.

So we need to agree on a compromise. Or do you find another smart solution?

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

i just commited a correct validation for a Date. Im not sure what to do with a firefox users. seems The best way is to stick with a US format for them, so you wont need to guess if value were in US or EU format. what do you think?

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

from another hand, we can try to rewrite the value in validation function to the needed format.
that would require to introduce new attribute 'format'

Form::Date ("Geburtsdatum:", "gebdat", array("required" => 1, 
    "shortDesc" => "Bitte das Eingabeformat beachten.",
    "pattern" => "\d{2}.\d{2}.\d{4}",
    "format" => "d-m-Y",
    "placeholder" => "TT.MM.JJJJ",
    "title" => "TT.MM.JJJJ  (Beispiel: 11.05.1975)"));

@avbdr
Copy link
Owner

avbdr commented Oct 24, 2015

Form::Date ("Geburtsdatum:", "gebdat", array("required" => 1, 
    "shortDesc" => "Bitte das Eingabeformat beachten.",
    "format" => "EU",
    "placeholder" => "TT.MM.JJJJ",
    "title" => "TT.MM.JJJJ  (Beispiel: 11.05.1975)"));
Form::Date ("Geburtsdatum:", "gebdat", array("required" => 1, 
    "shortDesc" => "Bitte das Eingabeformat beachten.",
    "format" => "US",
    "placeholder" => "MM/TT/JJJJ",
    "title" => "MM/TT/JJJJ  (Beispiel: 05/11/1975)"));

@raspime
Copy link
Author

raspime commented Oct 24, 2015

OK
I made up my mind and also tested your changes.

  • I am using the new element Date where you are using date input and also validating "date" instead of RegExp.
  • I am setting the "pattern" parameter in both ways
  • I tested in FF and in Chrome and both worked fine.

I think best would be to stay with patterns (instead of introducing "format"). This way everybody can put in his own pattern instead just having two "formats". And even if there are only these two. With the pattern you know exactly what to expect.

According to my (todays) thoughts - Just keep the solution as it is right now in Github (please think on versioning in case somebody already download 4.0) ;-) even if just one file has been changed slightly.

Thanks for your help and discussion.

@avbdr
Copy link
Owner

avbdr commented Oct 25, 2015

ok. lets wait till next bugreport 'Date returned in wrong format'.

I have changed version to 4.0-trunk, to identify that its not a release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants