cancel
Showing results for 
Search instead for 
Did you mean: 

Custom option datepicker disable previous date

SOLVED

Custom option datepicker disable previous date

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.

4 REPLIES

Re: Custom option datepicker disable previous date

@ManthanDave

@damian

Do you any idea about this?

Re: Custom option datepicker disable previous date

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.

Re: Custom option datepicker disable previous date

@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.

Re: Custom option datepicker disable previous date

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.