Custom option datepicker disable previous date

[Neeraj02381]

I am using Magento 2. In my product detail page I have created custom option and added a datepicker in it for date type.

The type of custom option is date. I need to disable previous dates. The customer should not be able select previous date.

How can I disable previous dates in custom option datepicker?

If anyone know about this please let me know.

Any help will be appreciated.

[Neeraj02381]

@Manthan Dave

@damian

Do you any idea about this?

[Sunil Patel]

Hello @Neeraj02381

you need to copy below file into your theme

https://github.com/magento/magento2/blob/2.2-develop/app/code/Magento/Catalog/view/frontend/template...

And below js for that

<script>
    require([
        "jquery",
        "mage/calendar"
    ], function ($) {
   // my id will be replace with your custom option id  or class
        $("#My_ID").calendar({
            showsTime: false,
            hideIfNoPrevNext: true,
            buttonText: "<?php echo __('Select Date') ?>",
            minDate: new Date(),
            dateFormat: 'yy-mm-dd'
        });
    });
</script>

hope it ill help you.

[Neeraj02381]

@Sunil Patel

I copy vendor\magento\module-catalog\view\frontend\templates\product\view\options\type\date.phtml file into app\design\frontend\Solwin\freego\Magento_Catalog\templates\product\view\options\type\date.phtml

and add script code below this file but It not work.

When we create date custom option script already added below the input box and the ID is different for all the products.

I just replace my_ID with options_<?php echo $_optionId; ?>_date but it doesn't work.

When I see with inspect element it is showing 2 scripts. First one is default that come earlier and second one I added recently.

[Neeraj02381 · Accepted solution]

I found the solution.

override vendor\magento\module-catalog\view\frontend\templates\product\view\options\type\date.php in your theme and add calendar script. It shows duplicate same script on page.

For duplicate script I commented magento's default script from vendor\magento\framework\View\Element\Html\date.php

After that I override date.phtml file in my theme and add my script with previous date disable tag.

Now it is working fine for me.

[waqassadafa462]

Hallo. How to override vendor/magento/framework/View/Element/Html/Date.php ?