账户创建提交跳转异常：表单验证失效问题求助

问题本质 #

你添加的return_to隐藏字段会让Shopify后端无论表单验证是否失败，都跳转到指定路径，导致错误信息无法在原页面展示，看起来像是验证机制失效。

解决方案 #

方法一：利用Shopify Liquid原生判断（推荐） #

通过服务器端Liquid模板判断表单是否有错误，仅在验证成功时添加return_to字段：

修改你的{% form 'create_customer' %}代码块，在表单内添加条件判断的隐藏字段：

{% form 'create_customer' %}
  <!-- 原有错误提示区域 -->
  <div data-cc-animate data-cc-animate-delay="0.2s">
    {{ form.errors | default_errors }}
  </div>

  <!-- 仅在无错误时添加跳转字段 -->
  {% if form.errors == blank %}
    <input type="hidden" name="return_to" value="/pages/become-a-partner-submit">
  {% endif %}

  <!-- 原有表单输入区域不变 -->
  <div class="form">
    <!-- ... 你的输入框代码 ... -->
  </div>
{% endform %}

原理：当表单提交有错误时，Shopify会重新渲染当前页面并填充form.errors，此时不会添加return_to，页面停留在原页面显示错误；当验证成功时，form.errors为空，添加跳转字段，后端会引导用户跳转到指定页面。

方法二：前端JS拦截提交（自定义验证） #

如果需要更灵活的前端验证逻辑，可以拦截表单提交事件，先完成验证再处理跳转：

移除原来注释的return_to脚本，添加以下JS代码：

$(document).ready(function() {
  const $createForm = $('#create_customer form');
  const TARGET_PATH = '/pages/become-a-partner-submit';

  $createForm.on('submit', function(e) {
    // 1. 执行前端必填项验证
    let isFormValid = true;
    const requiredFields = $('#first_name, #last_name, #email, #password');
    
    requiredFields.each(function() {
      if ($(this).val().trim() === '') {
        isFormValid = false;
        $(this).addClass('input-error'); // 可自定义错误样式
      } else {
        $(this).removeClass('input-error');
      }
    });

    // 2. 验证邮箱格式
    const emailVal = $('#email').val().trim();
    const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    if (!emailPattern.test(emailVal)) {
      isFormValid = false;
      $('#email').addClass('input-error');
    }

    // 3. 验证不通过则阻止提交
    if (!isFormValid) {
      e.preventDefault();
      return;
    }

    // 4. 验证通过后添加跳转字段并提交
    $createForm.append($('<input>', {
      type: 'hidden',
      name: 'return_to',
      value: TARGET_PATH
    }));
  });
});

原理：先通过JS完成前端基础验证，只有验证通过时才添加return_to字段并允许表单提交，确保错误时页面不跳转，保留错误提示。

为什么原来的代码失效？ #

你之前的脚本会无条件给表单添加return_to字段，Shopify后端接收到该字段后，会忽略验证错误状态直接跳转，导致原页面无法显示错误信息，让你误以为验证机制失效。

内容的提问来源于stack exchange，提问作者mbkadoglu