OpenDevelopmentMekong / wp-odm_theme

Wordpress child theme for ODM, based on jeo
https://opendevelopmentmekong.net
5 stars 4 forks source link

[IMP] Change the max date picker to current date #1333

Closed S-mardii closed 2 years ago

S-mardii commented 2 years ago

Set the max attribute of the date input to the current date instead of modified date as some posts has the modified date as NaN.

EricSoroos commented 2 years ago

On PP, let me know to push to prod. @S-mardii

S-mardii commented 2 years ago

Thank you @EricSoroos

Tested on PP. It keeps showing this issue Please enter a value greater than or equal to NaN.

If the min and max attribute is the issue, maybe we can consider remove it from the input

image

Is it related to these issues:

EricSoroos commented 2 years ago

Can you give me a link to get to a page where I can see this?

Those two issues are for jquery-ui before 1.11, and we're running 1.11.4, so that shouldn't be the issue that we're having.

S-mardii commented 2 years ago

This is the link to one of the topic page on PP: https://pp.opendevelopmentcambodia.net/wp-admin/post.php?post=130656&action=edit

Test Flow:

  1. Go to Updated date section
  2. Select a date from the date picker
  3. Click on Update the page
EricSoroos commented 2 years ago

Ok, so the problem here is that jQuery.validate's max/min don't work with dates.

In line 934 of https://pp.opendevelopmentcambodia.net/wp-content/plugins/magic-fields-2/js/third_party/jquery.validate.min.js?ver=5.4 :

        $.each(['minlength', 'maxlength', 'min', 'max'], function() {
            if (rules[this]) {
                rules[this] = Number(rules[this]);
            }
        });

It casts all min and max to a number, which in this case (YYYY-MM-DD) turns out to be NAN.

Later, when the min and max are actually checked (line 1080):

        // http://docs.jquery.com/Plugins/Validation/Methods/min
        min: function( value, element, param ) {
            return this.optional(element) || value >= param;
        },

        // http://docs.jquery.com/Plugins/Validation/Methods/max
        max: function( value, element, param ) {
            return this.optional(element) || value <= param;
        },

It just compares, it doesn't cast to a number, it just compares to the previously cast value. So, in this case, you're comparing NaN to a string date, and it fails.

So, the options are either: 1) Give up on range validation 2) Look for an update to jQuery.validation 3) Potentially patch in a maxDate, where it's just string comparison (which will work for iso style dates)

S-mardii commented 2 years ago

@EricSoroos Thank you for the clear explanation and the suggestion. I would consider option 1 or 2. I will check for the higher version for jQuery.validation and test it out to make sure that it won't break the other features. If I couldn't find that, I think we can go for option 1.