315 votes
0 answers
html - Issue copy pasted Form doesn't work in shopify
I have an issue I have a small form where you can add sizes of an item, once you click on it a quick card appears. I need to add the same form in the same but it appears only on hover. The copied one is not working. In the console I found this message when I click on the submit button: " Form submission canceled because the form is not connected shopify"
<form v-if="!isSoldOut" :data-single-variant="product.variants.length == 1 || !product.options.find(o => o.name == 'TAILLE')"
:data-variant="selectedVariantForPrice.id"
class="usf-add-to-cart"
formmethod="POST"
enctype="multipart/form-data"
:data-product-id="product.id"
:action="usf.platform.addToCartUrl"
@submit="e => _usfAddCartAjax(event)">
<input type="hidden" name="id" :value="selectedVariantForPrice.id">
<button v-if="product.variants.length == 1 || !product.options.find(o => o.name == 'TAILLE')"
:class="{'usf-visible': isHover}"
type="submit" name="add"
:disabled="isSoldOut"
class="usf-add-to-cart-btn usf-single usf-ajax-to-cart"
:data-product-id="product.id" >
<span class="usf-text" v-html="loc.addToCart"></span>
<svg x="0px" y="0px" width="32px" height="32px" viewBox="0 0 32 32" class="checkmark">
<path fill="none" stroke-width="2" stroke-linecap="square" stroke-miterlimit="10" d="M9,17l3.9,3.9c0.1,0.1,0.2,0.1,0.3,0L23,11"/>
</svg>
</button>
<div v-else :class="{'usf-visible': isHover}" type="submit" name="add" :disabled="isSoldOut" class="usf-add-to-cart-btn usf-ajax-to-cart" :data-product-id="product.id" >
<span class="usf-text" v-html="loc.addToCart"></span>
<svg x="0px" y="0px" width="32px" height="32px" viewBox="0 0 32 32" class="checkmark">
<path fill="none" stroke-width="2" stroke-linecap="square" stroke-miterlimit="10" d="M9,17l3.9,3.9c0.1,0.1,0.2,0.1,0.3,0L23,11"/>
</svg>
<usf-sizes :value="product"></usf-sizes></div>
</form>
Undefined asked
Source
Didn't find the answer?
Our community is visited by hundreds of Shopify development professionals every day. Ask your question and get a quick answer for free.
Similar questions
Find the answer in similar questions on our website.
Write quick answer
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.