Cant load json data from server to my routed tabs
Ok, provide more details, how, what and where you load?
My route script is here:-
var routes = [
{
path: ‘/’,
url: ‘./index.html’,
},
// About page
{
path: ‘/about/’,
url: ‘./pages/about.html’,
},
{
path: ‘/manage/’,
url: ‘./pages/manageins.html’,
},
{
path: ‘/catalogs/’,
componentUrl: ‘./pages/catalog.html’,
},
{
path: ‘/product/:id/’,
componentUrl: ‘./pages/product.html’,
},
{
path: ‘/settings/’,
url: ‘./pages/settings.html’,
},
{
path: ‘/page-loader-template7/:user/:userId/:posts/:postId/’,
templateUrl: ‘./pages/page-loader-template7.html’,
},
{
path: ‘/page-loader-component/:user/:userId/:posts/:postId/’,
componentUrl: ‘./pages/page-loader-component.html’,
},
// Default route (404 page). MUST BE THE LAST
{
path: ‘(.*)’,
url: ‘./pages/404.html’,
},
My Index File Is Here:-
<div class="test"></div>
<div class="list links-list searchbar-hide-on-search">
<ul>
<li>
<a href="/about/">
<div class="item-media"><i class="f7-icons">paper_plane_fill</i></div>About radio
<div class="item-after"></div></a>
</li>
<li>
<a href="/products/">
<div class="item-media"><i class="f7-icons">data_fill</i></div>Radio Products
<div class="item-after"><span class="badge">5</span><div class="item-after">New</div></div>
</a>
</li>
<li>
<a href="/manageins/">
<div class="item-media"><i class="f7-icons">collection_fill</i></div>Manage Radio
<div class="item-after"><span class="badge">5</span></div></a>
</li>
<li>
<a href="/Value/">
<div class="item-media"><i class="f7-icons">data_fill</i></div>Value radio
<div class="item-after"></div>
</a>
</li>
<li>
<a href="/covers/">
<div class="item-media"><i class="f7-icons">world_fill</i></div>Media & Share
<div class="item-after"></div></a>
</li>
<li>
My manage page that has tabs is Here;-
div class="page">
div id="io.framework7.testapp">
div class="views tabs ios-edges">
- Tabbar for switching views-tabs -->
div class="toolbar tabbar-labels toolbar-tob-md">
div class="toolbar-inner">
a href="#view-home" class="tab-link tab-link-active">
i class="icon f7-icons ios-only">home</i>
<i class="icon f7-icons ios-only icon-ios-fill">home_fill</i>
i class="icon material-icons md-only">home</i>
span class="tabbar-label">Home</span>
</a>
a href="#view-catalog" class="tab-link">
<i class="icon f7-icons ios-only">list</i>
<i class="icon f7-icons ios-only icon-ios-fill">list_fill</i>
<i class="icon material-icons md-only">view_list</i>
span class="tabbar-label">Catalog</span>
/a>
a href="#view-settings" class="tab-link">
i class="icon f7-icons ios-only">settings</i>
i class="icon f7-icons ios-only icon-ios-fill">settings_fill</i>
i class="icon material-icons md-only">settings</i>
span class="tabbar-label">Settings</span>
/a>
</div>
</div>
<!-- Your main view/tab, should have "view-main" class. It also has "tab-active" class -->
<div id="view-home" class="view view-home tab tab-active">
<!-- Page, data-name contains page name which can be used in page callbacks -->
<div class="page" data-name="home">
<!-- Top Navbar -->
</div>
</div>
<!-- Catalog View -->
<div id="view-catalog" class="view view-catalog tab">
<!-- Catalog page will be loaded here dynamically from /catalog/ route -->
</div>
<!-- Settings View -->
<div id="view-settings" class="view view-settings tab">
<!-- Settings page will be loaded here dynamically from /settings/ route -->
</div>
</div>
<!-- Popup -->
<!-- Login Screen -->
<div class="login-screen" id="my-login-screen">
<div class="view">
<div class="page">
<div class="page-content login-screen-content">
<div class="login-screen-title">Login</div>
<div class="list">
<ul>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-label">Username</div>
<div class="item-input-wrap">
<input type="text" name="username" placeholder="Your username">
</div>
</div>
</li>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-label">Password</div>
<div class="item-input-wrap">
<input type="password" name="password" placeholder="Your password">
</div>
</div>
</li>
</ul>
</div>
<div class="list">
<ul>
<li>
<a href="#" class="item-link list-button login-button">Sign In</a>
</li>
</ul>
<div class="block-footer">Some text about login information.<br>Click "Sign In" to close Login Screen</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Cordova -->
<!--
<script src="cordova.js"></script>
-->
<!-- Framework7 library -->
<script src="./js/framework7.min.js"></script>
<!-- App routes -->
<script src="./js/routes.js"></script>
<!-- Your custom app scripts -->
<script src="./js/app.js"></script>
Your topic title is:
Cant load json data from server to my routed tabs
I can’t see anything related to JSON or routed tabs in your code