产品页面上的日期选择器-Shopify

Question

我正在尝试让我的产品页面上的日期选择器工作。

现在我正在使用这个代码，它运行得很好。但它没有携带所选日期数据。所以我在订单或购物车页面上看不到它。

如果我在购物车页面上有日期选择器，它会起作用，但因为我只需要某些产品的日期选择器。所以我为这些产品制作了一个单独的产品页面。

代码

{{ '//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; display:inline-block;">
<p>
<label for="date">Vælg leveringsdato:</label>
<input id="date" type="text" name="attributes[date]" value="{{ product_form_id }}" />
</p>
</div>
<script>
window.onload = function() {
if (window.jQuery) {
let $ = window.jQuery;

$(function() {
$("#date").datepicker({
minDate: +1,
maxDate: '+2M',
beforeShowDay: $.datepicker.noWeekends,
dayNamesMin: [ "Søn", "Man", "Tir", "Ons", "Tors", "Fre", "Lør" ],
monthNames: [ "Januar", "Februar", "Marts", "April", "Maj", "Juni", "Juli", 
"August", "September", "Oktober", "November", "December" ]

});
});
}
}
</script> 

Answer 1

如果我是你，我会遵循不同的模式。我不使用购物车属性，而是使用产品行项目属性。然后你会得到每个产品的日期。想象一下，一个客户想要两个产品，每个产品都有日期？你的属性想法会失败的！

您可以学习许多关于行项目属性的教程，甚至还有生成器页面可以为您生成所有代码。只需将日期选择器的输出替换为行项目属性的输入，您就会在订单中看到客户选择的日期正确的订单。