javascript - Magento 表单验证，表单不提交有效字段

Question

我已经创建了一个自定义注册表单，以包含在我的 Magento 模板的标题中，该模板发布到我正在构建的扩展。

我在表单上使用了 Magento 表单验证，但是当我点击提交时 - 表单什么都不做。我可以看到“验证通过”类已应用于所有元素，但没有任何反应。

<form action="http://XXXXXXX/newslettersignup/" method="post" id="newsletter-validate-detail">
    <div class="formBox">
        <ul class="form-list">
            <li>
                <div class="field">
                    <label for="email" class="required">Email</label>
                    <div class="input-box">
                        <input  type="email" name="email" id="email" title="Email" value="" class="input-text required-entry validate-email" />
                    </div>
                </div>
            </li>
            <li id="title_item">
                <div class="field">
                    <label for="title" class="required">Title</label>
                    <div class="input-box">
                        <select id="title" name="title" title="Title">
                            <option value="Mrs">Mrs</option>
                            <option value="Miss">Miss</option>
                            <option value="Ms">Ms</option>
                            <option value="Mr">Mr</option>
                            <option value="Dr">Dr</option>
                            <option value="Lady">Lady</option>
                            <option value="Other">Other</option>
                        </select>
                    </div>
                </div>
            </li>
            <li id="other_title_item" style="display:none;">
                <div class="field">
                    <label for="other_title" >Other</label>
                    <div class="input-box">
                        <input name="other_title" id="other_title" title="Title" value="" class="input-text" type="text" />
                    </div>
                </div>
            </li>
            <li>
                <div class="field">
                    <label for="firstname" class="required">First Name</label>
                    <div class="input-box">
                        <input name="firstname" id="firstname" title="First Name" value="" class="input-text required-entry" type="text" />
                    </div>
                </div>
            </li>
            <li>
                <div class="field">
                    <label for="lastname" class="required">Surname</label>
                        <div class="input-box"><input name="lastname" id="lastname" title="Surname" value="" class="input-text required-entry" type="text" /></div>
                        <button type="submit" title="Sign up" class="button slidein-submit">
                            <span><span>Sign up</span></span>
                        </button>
                </div>
            </li>
        </ul>
    </div>
</form>

<script type="text/javascript">
    //<![CDATA[
        var newsletterSubscriberFormDetail = new VarienForm('newsletter-validate-detail');
    //]]>
</script>

Answer 1

问题是我在页面上有两个具有相同 ID“newsletter-validate-detail”的表单。

我通过在 varien/js.js 的第 321 行放置一个断点发现了这一点，它告诉我另一个输入在页面上的验证失败。我意识到此输入属于同一 ID 的另一种形式。

一旦我更改了表单上的表单 ID，它就可以正常提交了。