3. Linking to an onsen template from an external page?

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Linking to an onsen template from an external page?

  • B

    I’m using Onsen UI with jQuery for a mobile prototype, and I’m wondering if there’s a way to link to a specific template without using Onsen’s native navigation.

    Ex. SomePage.php contains a link that needs to go to the second template in this code:

    <ons-splitter>
<ons-splitter-side id="menu" side="left" width="220px" collapse>
  <ons-page>
    <ons-list>
      <ons-list-item modifier="nodivider" onclick="fn.load('home.html');" class="current" tappable>Home</ons-list-item>
      <ons-list-item modifier="nodivider" onclick="fn.load('assets.html');" tappable>Assets</ons-list-item>
    </ons-list>
  </ons-page>
</ons-splitter-side>
<ons-splitter-content id="content" page="home.html"></ons-splitter-content>
</ons-splitter>

<template id="home.html">
<ons-page>
  <ons-toolbar>
    <div class="left hamburger"><ons-toolbar-button onclick="fn.open()"><ons-icon icon="fa-navicon"><span class="badge">6</span></ons-icon></ons-toolbar-button></div>
  <div class="center">Logo</div>
  <div class="right">Thing</div>
  </ons-toolbar>

Page
  
</ons-page>
</template>

<template id="assets.html">
<ons-page>
  <ons-toolbar>
    <div class="left hamburger"><ons-toolbar-button onclick="fn.open()"><ons-icon icon="fa-navicon"><span class="badge">6</span></ons-icon></ons-toolbar-button></div>
  <div class="center">Logo</div>
  <div class="right">Thing</div>
  </ons-toolbar>

Link to THIS sub-page/template
  
</ons-page>
</template>

    How could I accomplish linking to that second template using a standard HREF? Everything I’ve tried just loads the home.html template.

    1