Shopify：单击按钮时如何将产品名称添加到输入字段表单？

Question

I have this function works well with me to get the URL of page using Input Field:

var url      = window.location.href;
$( document ).ready(function() {
$('#url').val(url);
});

I want to make it works to get Product Name, please can anyone show me how I can do that? note that I want to use it with Shopify Store.

Here's the input field code:

<input type="text" name="entry.123456789" id="url" value="" style="display: none;">

Thanks y'all guys in advance for your help!

Answer 1

Shopify has a global product object available on Product pages. If you need this form on some product page, then using the code below should work fine.

<input type="text" name="product-title" value="{{product.title}}" style="display: none;">

If you need it on some other page, get a single product object (eg using all_products) and then use the title property.

Moreover, from the display none, I have understood that you just need to get this data when form is submitted and does not need input from user. In that case, hidden field is recommended.

<input type="hidden" name="product-title" value="{{product.title}}">

As per addition in comments, if you are trying to get this on Cart page, the available object is named as cart . You can loop over the products in cart and then get title.

{% for line_item in cart.items %}
    <input type="hidden" name="product-title-{{line_item.product_id}}" value="{{line_item.product.title}}">

    {{line_item.product.title}} - {{line_item.quantity}}

{% endfor %}

This will generate the hidden input fields. Change the input name accordingly.

Input Type Hidden

Shopify Product Object