找到2个具有非唯一ID的元素#billing-new-address-form Magento 2


8

在结帐页面上,当选择送货方式并转到下一步“付款”时,我收到以下控制台错误。

[DOM]找到了两个具有非唯一ID#billing-new-address-form的元素:

[DOM]找到了两个具有非唯一ID#billing-save-in-address-book的元素:

我该如何解决这个问题?


这是默认/干净的Magento 2商店吗?哪个版本?似乎是Magento 2中的错误。是否存在与此相关的Gitub问题?从Chrome 63开始,它现在引发与DOM相关的错误。
Erfan

我在Magento社区版2.1.9中有同样的问题
Supersonic

任何解决方案
艾哈迈德·瓦卡斯·汗

github.com/magento/magento2/issues/13415-./magento/module-checkout/view/frontend/web/template/billing-address/*.html中的模板用于结算地址可能不相等的每种付款方式发货时,当页面上出现2个具有相同ID的DOM元素时,会引发错误。我们需要在这些ID中添加付款方式代码,但这是前端模板。只有JS代码可以做到,但我不知道怎么做。
亚历克斯·古塞夫

我在2.1.8上遇到了相同的问题,但是有#agreements。我一直在使用法师2.2文件覆盖Magento的协议与Magento_CheckoutAgreements核心模块在我的自定义模板github.com/magento/magento2/tree/2.2/app/code/Magento/...需要的文件:网页/模板/结帐/结帐agreements.html web / js / model / agreement-validator.js web / js / view / checkout-agreements.js
Gediminas

Answers:


1

此问题已在2.3-develop分支中修复,也已向后移植到2.2,并将在2.2.6中发布,我也看到它也已向后移植到2.1。

有2个地方需要更改以解决此问题

供应商/magento/module-gift-message/view/frontend/web/template/gift-message-form.html

<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<!-- ko if: isActive() -->
<div class="gift-message">
    <div class="gift-options-title">
        <span data-bind="i18n: 'Gift Message (optional)'"></span>
    </div>
    <div class="gift-options-content">
        <fieldset class="fieldset">
            <div class="field field-to">
                <label data-bind="attr: {for: 'gift-message-whole-to-' + index }" class="label">
                    <span data-bind="i18n: 'To:'"></span>
                </label>
                <div class="control">
                    <input type="text"
                           class="input-text"
                           data-bind="value: getObservable('recipient'), attr: { id: 'gift-message-whole-to-' + index }">
                </div>
            </div>

            <div class="field field-from">
                <label data-bind="attr: {for: 'gift-message-whole-from-' + index }" class="label">
                    <span data-bind="i18n: 'From:'"></span>
                </label>
                <div class="control">
                    <input type="text"
                           class="input-text"
                           data-bind="value: getObservable('sender'), attr: { id: 'gift-message-whole-from-' + index }">
                </div>
            </div>
            <div class="field text">
                <label for="gift-message-whole-message" class="label">
                    <span data-bind="i18n: 'Message:'"></span>
                </label>
                <div class="control">
                    <textarea id="gift-message-whole-message"
                              class="input-text"
                              rows="5" cols="10"
                              data-bind="value: getObservable('message')"></textarea>
                </div>
            </div>
        </fieldset>

    </div>
</div>
<!-- /ko -->
<div class="actions-toolbar">
    <div class="secondary">
        <button type="submit" class="action secondary action-update" data-bind="
                    attr: {title: $t('Update')},
                    click: $data.submitOptions.bind($data)">
            <span data-bind="i18n: 'Update'"></span>
        </button>
        <button class="action action-cancel" data-bind="
                    attr: {title: $t('Cancel')},
                    click: $data.hideFormBlock.bind($data)">
            <span data-bind="i18n: 'Cancel'"></span>
        </button>
    </div>
</div>

供应商/magento/module-checkout/view/frontend/web/template/billing-address/form.html

<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<div class="billing-address-form" data-bind="fadeVisible: isAddressFormVisible">
    <!-- ko foreach: getRegion('before-fields') -->
    <!-- ko template: getTemplate() --><!-- /ko -->
    <!--/ko-->
    <form data-bind="attr: {'data-hasrequired': $t('* Required Fields')}">
        <fieldset
            data-bind="attr: { id:'billing-new-address-form-'+index, value:index}"
            class="billing-new-address-form fieldset address">
            <!-- ko foreach: getRegion('additional-fieldsets') -->
            <!-- ko template: getTemplate() --><!-- /ko -->
            <!--/ko-->
            <!-- ko if: (isCustomerLoggedIn && customerHasAddresses) -->
            <div class="choice field">
                <input type="checkbox" class="checkbox"  data-bind="checked: saveInAddressBook, attr: {id: 'billing-save-in-address-book-' + getCode($parent)}" />
                <label class="label" data-bind="attr: {for: 'billing-save-in-address-book-' + getCode($parent)}" >
                    <span data-bind="i18n: 'Save in address book'"></span>
                </label>
            </div>
            <!-- /ko -->
        </fieldset>
    </form>
</div>

干杯


-1

如果您想解决问题,请执行以下步骤

  1. 首先在.phtml文件中找到该html所在的位置
  2. 现在用循环(for,foreach)分析任何获取数据的对象
  3. 如果数据与该ID一起循环,则添加一些唯一数据

像这样

<?php
foreach ($variable as $key => $value) {
 ?>
      <div id="billing-new-address-form<?php echo "-"."daynamic some unique id"; ?>"></div>
 <?php
}
?>

和uniq id已生成


它不起作用。
Shekhar Suman
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.