Hello,
I have a pretty basic setup. I have the nav-view to navigate between two pages: a welcome screen and a login screen. When I get to the login screen, I’m unable to click either the login button or the help; button. My index.html file looks like this:
<body>
<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="bar-positive" animation="nav-title-slide-ios7">
<ion-nav-back-button class="button-icon ion-arrow-left-c">
</ion-nav-back-button>
<h1 class="title">My App</h1>
</ion-nav-bar>
<ion-nav-view animation="slide-left-right">
</ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-header-bar class="bar-dark">
<h1 class="title">My App</h1>
</ion-header-bar>
<ion-content>
<div class="list">
<div class="item item-divider">
User
</div>
</div>
</ion-content>
</ion-side-menu>
</ion-side-menus>
</body>
My welcome.html file looks like this:
<ion-view class="solid-background" title="My App">
<ion-content>
<div class="row" style="height:85%;">
<div class="col">
<ion-slide-box on-slide-changed="slideChanged(index)">
<ion-slide class="box-slide">
<div class="slide-fg">
<h3>Slide 1</h3>
<p>Slide content</p>
</div>
</ion-slide>
<ion-slide class="box-slide">
<div class="slide-fg">
<h3>Slide 2</h3>
</div>
</ion-slide>
<ion-slide class="box-slide">
<div class="slide-fg">
<h3>Slide 3</h3>
</div>
</ion-slide>
</ion-slide-box>
</div>
</div>
<div class="row" style="height:15%;">
<div class="col">
<button id="signupButton" class="full-width button button-balanced" ng-click="registerButton_Click()">Sign Up</a>
</div>
<div class="col">
<button id="loginButton" class="full-width button button-positive" ng-click="loginButton_Click()">Login</button>
</div>
</div>
</ion-content>
</ion-view>
My login.html file looks like this:
<ion-view>
<ion-content ng-controller="LoginController">
<div class="row">
<div class="col">
<div class="list list-inset">
<label class="item item-input item-button-right">
<i class="icon icon-user placeholder-icon"></i>
<input id="usernameTextBox" type="text" placeholder="username" />
</label>
<label class="item item-input">
<i class="icon icon-lock5 placeholder-icon"></i>
<input id="passwordTextBox" type="password" placeholder="password" />
</label>
</div>
</div>
</div>
<div class="row">
<div class="col">
<button id="loginButton" class="button button-positive" ng-click="loginButton_Click()">Login</button>
</div>
<div class="col">
<button id="helpButton" class="button button-balanced" ng-click="helpButton_Click()">Help</button>
</div>
</div>
<ion-content>
</ion-view>
Why can’t I click either the login or help button? The buttons work fine on welcome.html. Yet, when I get to login.html, I cannot click the buttons. In fact, if I hover over the login or help button, the cursor does not change to a finger. Oddly, there are no errors in the JavaScript console either. Wht would cause this?
.
