0

I have add accordion widget to Onestep Checkout following this guide http://devdocs.magento.com/guides/v2.0/javascript-dev-guide/widgets/widget_accordion.html but it does not works

    <div id="shipping" class="checkout-shipping-address">
    <div class="step-title" data-role="collapsible">
        <div data-role="trigger">
            <i class="fa fa-home"></i>
             <span>Indirizzo di Spedizione</span>
        </div>
    </div>
    <div id="checkout-step-shipping"
         class="step-content"
         data-role="content">

        <!-- ko if: (!quoteIsVirtual) -->
            <!-- ko foreach: getRegion('customer-email') -->
                <!-- ko template: getTemplate() --><!-- /ko -->
            <!--/ko-->
        <!--/ko-->

        <!-- ko foreach: getRegion('address-list') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!--/ko-->

        <!-- ko foreach: getRegion('address-list-additional-addresses') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!--/ko-->

        <!-- Address form pop up -->
        <!-- ko if: (!isFormInline) -->
        <button type="button"
                data-bind="click: showFormPopUp, visible: !isNewAddressAdded()"
                class="action action-show-popup">
            <span data-bind="i18n: 'New Address'"></span></button>
        <div id="opc-new-shipping-address" data-bind="visible: isFormPopUpVisible()">
            <!-- ko template: 'Mageplaza_Osc/container/address/shipping/form' --><!-- /ko -->
        </div>
        <!-- /ko -->

        <!-- ko foreach: getRegion('before-form') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!--/ko-->

        <!-- Inline address form -->
        <!-- ko if: (isFormInline) -->
        <!-- ko template: 'Mageplaza_Osc/container/address/shipping/form' --><!-- /ko -->
        <!-- /ko -->

        <!-- ko if: (!isCustomerLoggedIn() && !quoteIsVirtual) -->
            <!-- ko foreach: getRegion('customer-email') -->
                <!-- ko template: 'Mageplaza_Osc/container/address/billing/create' --><!-- /ko -->
            <!--/ko-->
        <!--/ko-->

        <div class="mp-clear"></div>

        <!-- ko scope: 'checkout.steps.shipping-step.billingAddress' -->
            <!-- ko template: 'Mageplaza_Osc/container/address/billing/checkbox' --><!-- /ko -->
        <!--/ko-->

        <div class="mp-clear"></div>
    </div>
</div>
<script>
        require([
            'jquery',
            'accordion'], function ($) {
            $("#shipping").accordion();
        });
    </script>

1 Answer 1

0

Not sure what your issue is, do you have any console errors?

Try replacing your JS with this:

require([
    'jquery',
    'accordion',
    'domReady!'], function ($, accordion, doc) {
            $("#shipping").accordion();
});

This will ensure it's only initialised once the dom is ready.

5
  • thanks a lot but it does not works anymore. No console errors
    – Altravista
    Commented Oct 18, 2017 at 13:59
  • Is your code definitely being rendered, if you add a console log above the require call does it show?
    – Ben Crook
    Commented Oct 18, 2017 at 14:00
  • no console does not print log. really strange
    – Altravista
    Commented Oct 18, 2017 at 14:11
  • It sounds like your code may be cached, have you tried deploying static content again, clearing Magento and your browser cache.
    – Ben Crook
    Commented Oct 19, 2017 at 6:33
  • i'm working on dev mode script is correctly printed in html and updated. another strange thing is that also a requirejs custom script in javascript does not work but if i copy and past it on console it works fine. also tried with domReady! on define
    – Altravista
    Commented Oct 19, 2017 at 13:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.