Magento 2 – How to Open Tab on Page Load

jquerymagento2tabs

I have code like below in my html file

  <div class="payment-option _collapsible opc-payment-additional discount-code"
     data-bind="mageInit: {'collapsible':{'openedState': '_active'}}">
    <div class="payment-option-title field choice" data-role="title">
        <span class="action action-toggle" id="block-comment-heading" role="heading" aria-level="2">
            <!-- ko i18n: 'Customer Note'--><!-- /ko -->
        </span>
    </div>
    <div class="payment-option-content" data-role="content">
        <form class="form form-discount" id="comment-form">
            <div class="payment-option-inner">
                <div class="field">
                    <label class="label" for="comment-code">
                        <span data-bind="i18n: 'Enter your comment'"></span>
                    </label>
                    <div class="control">
                        <textarea class="input-text" id="comment-code" name="comment-code" rows="2" maxlength="200" data-bind="attr:{placeholder: $t('Enter comment')} " ></textarea>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

Which opens tab on clicking the Customer Note text, how to open the tab on page load itself. please anybody suggest me.

Best Answer

You need to set active to true:

Change

data-bind="mageInit: {'collapsible':{'openedState': '_active'}}">

To

data-bind="mageInit: {'collapsible':{active: true, 'openedState': '_active'}}">

See https://devdocs.magento.com/guides/v2.2/javascript-dev-guide/widgets/widget_collapsible.html for more options.