I'm experimenting with Framework7 with this fun chat app I'm trying to make using PhoneGap previews. The thing is, I've never used Framework7 before and I'm having a tough time linking pages together under my main page.
I have a string of text with a <a href=""> tag, that I want to link to a form for people to sign up and create their profiles on the app. I've created a separate html file that I tried linking with the <a href="signup.html">, because that's what the examples showed that you can do, but when I test it, it doesn't work, the chrome inspector gives me this feedback:
framework7.min.js:23 XMLHttpRequest cannot load file:...Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
Below is my code, and the last string on the bottom is what I'm trying to link to the singup page with the form, any help is greatly appreciated.
<!-- Status bar overlay for full screen mode (PhoneGap) -->
<div class="statusbar-overlay"></div>
<!-- Views -->
<div class="views">
<!-- Your main view, should have "view-main" class -->
<div class="view view-main">
<!-- Pages container, because we use fixed-through navbar and toolbar, it has additional appropriate classes-->
<div class="pages navbar-through toolbar-through">
<!-- Page, "data-page" contains page name -->
<div data-page="index" class="page">
<!-- Scrollable page content -->
<div class="page-content login-screen-content">
<div class="login-screen-title"><img src="img/logo.png" width="130px" height="130px"></div>
<div class="login-screen-title">Welcome to<br>J Chat</div>
<p class="tour-content" style="text-align: center">Login below to get started!</p>
<form>
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div class="item-title label">Email</div>
<div class="input-inner">
<input type="text" name="email" placeholder="E-Mail">
</div>
</div>
</li>
<li class="item-content">
<div class="item-inner">
<div class="item-title label">Password</div>
<div class="input-inner">
<input type="password" name="password" placeholder="Password">
</div>
</div>
</li>
</ul>
</div>
<div class="list-block">
<ul>
<li>
<a href="home.html" class="button button-intro login ripple">Login</a>
</li>
</ul>
</div>
<!-- Link to another page -->
<div class="list-block" style="margin-top: 1em;">
<p class="tour-content">
Don't have an account yet?<br>
<a href="signup.html">Click here</a> to sign up!
</p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
