Disable specific days in datepicker

TomKenny
New Member
2 0 0

Hi there,

 

I have seen similar posts to mine, but I cannot seem to get their answers to work for mine. 

I am trying to use the Date Picker code from https://help.shopify.com/themes/customization/cart/add-date-picker-for-delivery-dates to add a calendar where people can select the days they want their products delivered, but I would like to remove Tuesday - Thursday from the options. My code currently looks like this:

 

  {{ '//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' | stylesheet_tag }}
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" defer="defer"></script>

  <div style="width:300px; clear:both;">
    <p>
      <label for="date">Pick a delivery date:</label>
      <input id="date" type="text" name="attributes[date]" value="{{ cart.attributes.date }}" />
      <span style="display:block" class="instructions"> We do not deliver during the week-end.</span>
    </p>
  </div>

  <script>
    window.onload = function() {
      if (window.jQuery) {
        let $ = window.jQuery;

        $(function() {
          $("#date").datepicker({
            minDate: +1, 
            maxDate: '+2M',
            beforeShowDay: $.datepicker.noWeekends
            
            
          });
        });
      }
    }
  </script>

 

This removes weekends from the calendar fine, but whenever I try to change/add something to the code as per other suggestions to remove different days, the calendar just stops appearing all together in the website. 

Does anyone know how to change this code so that only Tuesday - Thursday is not available for delivery.

 

Thanks in advance

Tom

0 Likes
LitExtension
Shopify Partner
696 71 124

Hi @TomKenny

You can try with this snippet on the "beforeShowDay" key:

beforeShowDay: function (date) {

    if (date.getDay() == 2 || date.getDay() == 4) {

        return [false, ''];

    } else {

          return [true, ''];

    }

}

Link to refer: https://jsfiddle.net/EvanPham/L46mfez7/

Screenshot to refer: https://prnt.sc/11cc8un

Hope this helps.

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
TomKenny
New Member
2 0 0

Amazing, finally worked! Thank you so much!!

0 Likes
LitExtension
Shopify Partner
696 71 124

Hi @TomKenny

It's our pleasure when helping you. If you find my comments are helpful, please hit Like and Accept as a Solution. It absolutely encourages us! 

Feel free to let me know if you need further support from us! 

Greetings, 

LitExtension Team

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes