Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Form tag doesn't include the form.id #1650

Open
naxorn opened this issue Oct 31, 2022 · 4 comments
Open

Form tag doesn't include the form.id #1650

naxorn opened this issue Oct 31, 2022 · 4 comments

Comments

@naxorn
Copy link

naxorn commented Oct 31, 2022

Issue

When creating a form such as

{% form 'customer', id: 'ContactFooter' %}
  <span>{{ form.id }}</span>
  [...rest of content...]
{% endform %}

the form.id is nil

Expected

The form object id should be the id of the submitted form and be available within the form. This is especially useful when you might have multiple forms on the page and you want to use form.errors or form.posted_successfully?. Currently, you cannot identify which form actually has the errors. If you try to use those properties, both forms display errors. It would be awesome, if you could do something like:

{% form 'customer', id: 'SomeOtherForm' %}
  {% if form.errors and form.id == 'SomeOtherForm' %}
  [...errors for SomeOtherForm...]
  {% endif %}
{% endform %}


[...more content on the same page...]

{% form 'customer', id: 'ContactFooter' %}
  {% if form.errors and form.id == 'ContactFooter' %}
  [...errors for ContactFooter...]
  {% endif %}
{% endform %}

Discussion

Is having form.id always equal to nil expected behaviour?

@nathanot14
Copy link

Hi, did you ever managed to fix this? I having the exact same problem right now. Have two different customer subscribe forms on my page and every time when one getting submit, the other one also shows a succes massage.

@naxorn
Copy link
Author

naxorn commented Jan 27, 2023

No. Most of my hacks rely on the URL query parameters including 'unique' information. Of course, it would be fine if at least the URL always had the form id, such as "[url]?customer_posted=true#FORM-ID". Unfortunately, it is not always there such as when you encounter reCAPTCHA (#1511).

On my site, I limited myself to only a single customer subscribe form. Plus, I had to add javascript on the subscribe form to add back the URL hash when I see that the URL showed a 'customer' type form was posted. That way the page would jump back to the form on success.

Perhaps, you could have one 'form' and the rest of the subscribe parts as just links to the main form?

@spani85
Copy link

spani85 commented Jan 24, 2024

Is there any news regarding this problem? I have the exactly same problem and knowing the form.id could resolve the situation.

@ademers
Copy link

ademers commented Apr 26, 2024

I'm having the same issue. Any ideas at all? What is the purpose of {{ form.id }}? Documentation is sparse https://shopify.dev/docs/api/liquid/objects/form#form-id

It appears to be some sort of internal ID used in https://github.com/Shopify/dawn/blob/main/sections/main-addresses.liquid. It appears when I edit an address at /account/addresses. Screenshot: https://share.cleanshot.com/8qc1XKhTC4rfyz3kGLWs

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants