How to keep the selected accordion active on page reload

Question

I am using materialize collapsible for my navigation. Everything works fine except when I reload the page. The collapsible gets closed and I have to manually make it active again. How do I make the collapsible remain active on page reload?

Here's my code:

<ul id="slide-out" class="side-nav fixed leftside-navigation">
    <ul class="collapsible" data-collapsible="expandable">
        <li>
            <a class="collapsible-header">
                <i class="material-icons">home</i> Home
            </a>
            <div class="collapsible-body">
                <ul>
                    <li ui-sref-active="active">
                        <a ui-sref="protect" ui-sref-opts="{reload: true}">
                            <i class="material-icons">dashboard</i> Dashboard
                        </a>
                    </li>
                    <li ui-sref-active="active">
                        <a ui-sref="store" ui-sref-opts="{reload: true}">
                            <i class="material-icons">cloud_done</i> Storage
                        </a>
                    </li>
                </ul>
            </div>
        </li>
        <li>
            <a class="collapsible-header">
                <i class="material-icons">event_available</i>Manage
            </a>
            <div class="collapsible-body">
                <ul>
                    <li ui-sref-active="active">
                        <a ui-sref="manage" ui-sref-opts="{reload: true}">
                            <i class="material-icons">storage</i> Manage Storage
                        </a>
                    </li>
                    <li ui-sref-active="active">
                        <a ui-sref="enroll" ui-sref-opts="{reload: true}">
                            <i class="material-icons">file_download</i> Enroll
                        </a>
                    </li>
                </ul>
            </div>
        </li>
    </ul>
</ul>

Answer 1

What you want to do concerns program state, hence there's no way for you to do that unless you save the name or id of the active accordion. which can easily be done using browser local storage.