Hello,
We have javascript in the theme that uses the ajax api to add estimated ship dates for each cart line item.
We add these as checkout attributes during the checkout process by including a snippet in checkout.liquid.
In testing everything works correctly. But on the live site we intermittently get orders missing the estimated ship date attributes.
Is it not safe to rely on the ajax api for this information?
Example javascript that adds two cart attributes for the ship dates (one with title and one with variant id):
In testing this appears to work consistently. But on the live site we randomly get orders without the Est. ship date fields.
From my understanding we are doing everything in accordance with the documentation but getting unexpected results.
<script>
(function($) {
var item_ship_dates = {};
$(document).on("page:load page:change", function() {
{%- for attribute in checkout.attributes -%}
/* Include attribute for order items being shipped separately */
{%- if attribute.first == "separate_shipments" -%}
var input_html = '<input type=hidden name="checkout[attributes][{{ attribute.first }}]" value="{{ attribute.last }}">';
$("form.edit_checkout").append(input_html);
{%- endif -%}
{%- endfor -%}
if (Shopify.Checkout.step == 'contact_information' ||
Shopify.Checkout.step == 'shipping_method' ||
Shopify.Checkout.step == 'payment_method') {
{%- for item in checkout.line_items -%}
{%- capture item_date -%}{%- render "cart-item-ship-date", tags: item.product.tags, vrt: item.variant | strip -%}{%- endcapture -%}
{%- assign item_date = item_date | strip -%}
/* ship date with title for customer service */
item_ship_dates[{{ item.variant_id }}] = "{{ item_date }}";
var est_ship_date = '<input type="hidden" name="checkout[attributes][Est. ship date {{ item.title }}]" value="{{ item_date }}">';
$('form.edit_checkout').append(est_ship_date);
/* Ship date associated with variant id for notifications / thank you page */
var est_ship_date = '<input type="hidden" name="checkout[attributes][Est. ship date item {{ item.variant_id }}]" value="{{ item_date }}">';
$('form.edit_checkout').append(est_ship_date);
var selector = "tr[data-variant-id={{ item.variant_id }}] .product__description__variant";
var d = "<div>Est. ship date: {{ item_date }}</div>";
$(selector).append(d);
{%- endfor -%}
}
/*
...
Additional code to show the ship date on thank you page
*/
})(Checkout.$);
</script>
Additionally we are looking at other ways to accomplish this and have it work on the wholesale channel. So we will be migrating to doing line item ship dates with an app. Which apis would be most appropriate for this use case? Utilizing order metafields or something else?
But we'd like to have the ajax api ship dates at least working consistently.
Thank you for any suggestions.
