2017-10-24 10 views
0

Shopifyの納品日付ピッカーを特定の商品にのみご利用いただけるようにしています。ここで私はコードのみを持っている必要とし、カート内の項目は唯一の「浄化」のためである場合でも、配達日のオプションを表示したい Shopifyで特定の商品のみを納品日付ピッカーに設定

{{ '//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' | stylesheet_tag }} 
 
{{ '//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' | script_tag }} 
 

 
<div class="pickadate"> 
 
    <p> 
 
    <label for="date">Pick a pick up date:</label> 
 
    <input id="date" type="text" name="attributes[date]" value="{{ cart.attributes.date }}" /> 
 
    <span style="display:block" class="instructions"> <strong>Please note, cleanses need to be picked up between 9am and 10am from:</strong> <br /><br /><strong>The Juice Parlor</strong><br />5658 Cahuenga Blvd,<br />North Hollywood, CA 91601.</span> 
 
    </p> 
 
</div> 
 

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

 
{% comment %} 
 
    To remove days of the week that aren't Saturday and Sunday, use this: 
 
    http://stackoverflow.com/questions/2968414/disable-specific-days-of-the-week-on-jquery-ui-datepicker 
 
{% endcomment %} 
 

 
<script> 
 
    jQuery(document).ready(function() { 
 

 
     jQuery('input[name="checkout"], input[name="goto_pp"], input[name="goto_gc"]').click(function() { 
 
      if (jQuery('#date').val() == '') { 
 
       alert("You must pick a pick up date."); 
 
       return false; 
 
      } else { 
 
       jQuery(this).submit(); 
 
      } 
 
     }); 
 
    }); 
 
</script>

..私は現在持っているコードです。

カートに2つのアイテムがある場合は、クレンズとTシャツのように...私は日付ピッカーが「クレンズ」のために利用できるようにしてください。

+0

「クレンズ」としてこの日付ピッカーを作って、チェックしていますか?ショッピングカートの広告申込情報をどのようにレンダリングするかHTMLを含めることもできます –

+0

ここにはカートへのリンクがあります:https://the-juice-parlor.myshopify.com/cart –

+0

基本的なTシャツアイテムとテスト目的でサイトのアイテムをクレンズする。 –

答えて

0

何かがあなたのために働くでしょう。あなたのカートにあなたはCleanseアイテムを持っている場合、このコードは、それはそれは、製品のタイトルで日付が選ん示すと必要な

{% assign productTitleStr = cart.items | map: 'title'| uniq | join: ', ' %} 
{% if productTitleStr contains 'Cleanse' %} 
    <link href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" media="all" /> 
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript"></script> 

    <div class="pickadate"> 
     <p> 
      <label for="date">Pick a pick up date:</label> 
      <input id="date" type="text" name="attributes[date]" value="" required/> 
      <span style="display:block" class="instructions"> <strong>Please note, cleanses need to be picked up between 9am and 10am from:</strong> <br /><br /><strong>The Juice Parlor</strong><br />5658 Cahuenga Blvd,<br />North Hollywood, CA 91601.</span> 
     </p> 
    </div> 

    <script> 
     jQuery(document).ready(function() { 
      jQuery("#date").datepicker({ 
       minDate: +2, 
       maxDate: '+2M', 
       beforeShowDay: jQuery.datepicker.noWeekends 
      }); 
      jQuery('input[name="checkout"], input[name="goto_pp"], input[name="goto_gc"]').click(function() { 
       if (jQuery('#date').val() == '') { 
        alert("You must pick a pick up date."); 
        return false; 
       } else { 
        jQuery(this).submit(); 
       } 
      }); 
     }); 
    </script> 
{% endif %} 
+0

すごい!働いた!ありがとうございました! –

関連する問題