Mobiscroll.nav is not a function error

I bought javascript component license [ Gesture enabled listview ]
and I downlaod it from [ download.mobiscroll.com ] after I check all checkbox ( cards forms gridlayout listview popup scrollview )

and I tried to use it with demo example [ Scrollview for Javascript ] after I setup what I downloaded.
but there are error, [ Uncaught TypeError: mobiscroll.nav is not a function ]

what is this error and how can I solve this error?

var categoryNav, contentView; // init categories navigation categoryNav = mobiscroll.nav('.md-category', { theme: 'ios', themeVariant: 'light', type: 'tab', onItemTap: function (event, inst) { contentView.navigate(document.querySelector('.' + event.target.getAttribute('data-page'))); } }); // init content scrollview contentView = mobiscroll.scrollview('.md-content', { theme: 'ios', themeVariant: 'light', layout: 1, paging: true, threshold: 15, cssClass: 'md-page', onAnimationStart: function (event, inst) { var selectedIndex = parseInt((-(event.destinationX / inst.contWidth)).toString(), 10), selectedItem = document.querySelectorAll('.md-category li')[selectedIndex]; if (!selectedItem.classList.contains('mbsc-ms-item-sel')) { categoryNav.navigate(selectedItem); } } }); // init content listview mobiscroll.listview('.md-list', { theme: 'ios', themeVariant: 'light', swipe: false, striped: true, enhance: true }); body, mbsc-page>.mbsc-page { margin: 0; padding: 0; height: 100%; overflow: visible; } .md-paging, .md-paging>div, .md-paging .md-page { height: 100%; padding: 0; overflow: hidden; } .md-paging .md-list-cont, .md-paging .mbsc-scv-item>.mbsc-lv-cont { -webkit-box-flex: 1; -webkit-flex: 1 auto; -ms-flex: 1 auto; flex: 1 auto; overflow: auto; -webkit-overflow-scrolling: touch; } .md-paging .mbsc-lv-img { pointer-events: none; border-radius: 2.8em; height: 2.8em; }
  • Pop
  • Rock
  • Jazz
  • Piano
  • Electric
<ul class="md-content mbsc-cloak">
    <li class="md-pop">
        <ul class="md-music-lv md-list mbsc-cloak">
            <li data-icon="play" data-icon-align="right"><img src="https://img.mobiscroll.com/demos/paging/Adele_1x.png" />
                <h4>Hello</h4>
                <p>Adele</p>
            </li>
            <!-- Showing partial data. Download full source. -->
        </ul>

    </li>

    <li class="md-rock">
        <ul class="md-music-lv md-list mbsc-cloak">
            <li data-icon="play" data-icon-align="right"><img src="https://img.mobiscroll.com/demos/paging/Elle_King_1x.png" />
                <h4>Ex's & Oh's</h4>
                <p>Elle King</p>
            </li>
        </ul>

    </li>

    <li class="md-jazz">
        <ul class="md-music-lv md-list mbsc-cloak">
            <li data-icon="play" data-icon-align="right"><img src="https://img.mobiscroll.com/demos/paging/Jeff_Lorber_1x.png" />
                <h4>Get Up</h4>
                <p>Jeff Lorber Fusion</p>
            </li>
        </ul>

    </li>

    <li class="md-piano">
        <ul class="md-music-lv md-list mbsc-cloak">
            <li data-icon="play" data-icon-align="right"><img src="https://img.mobiscroll.com/demos/paging/Rachmaninoff_1x.png" />
                <h4>Etudes Tableaux</h4>
                <p>Rachmaninoff</p>
            </li>
        </ul>

    </li>

    <li class="md-electric">
        <ul class="md-music-lv md-list mbsc-cloak">
            <li data-icon="play" data-icon-align="right"><img src="https://img.mobiscroll.com/demos/paging/Major-Lazer_1x.png" />
                <h4>Lean On</h4>
                <p>Major Lazer & DJ Snake Featuring M0</p>
            </li>
        </ul>
    </li>
</ul>

Hi @hyeongrae_jo :wave:

Sorry about the trouble :wink:

This error occurred because the Navigation component was not included in your custom package.

The Download Page was fixed, now you should be able to download the Navigation component as well :wink:

Let me know if that solved this problem!