Reputation: 779
I have created a cordova ionic app with side menu. By default, I need to keep side menu open. When I click on a button on page, it doesn't work. I have click twice on the page. First time when i click on button, side menu closes, then i have to click on button again to perform the operation. How can i make it work even if the side menu is open.
SideMenu.html
<ion-side-menus enable-menu-with-back-views="false" class="menu-page">
<ion-side-menu-content>
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-buttons side="left" >
<button class="button button-icon button-clear ion-navicon" menu-toggle="left">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view name="menuContent"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left" class="left-nav">
<ion-content scroll="false" has-bouncing="false">
<div class="user-info text-center">
</div>
<ion-list>
<a class="item item-icon-left" menu-close ui-sref="app.menuscreen" ui-sref-active="selected">
<i class="ion-home"></i><span>Home</span>
</a>
</ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>
app.js
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: '/app',
abstract: true,
templateUrl: 'templates/sidemenu.html',
})
.state('app.menuscreen', {
url: '/menuscreen',
views: {
'menuContent': {
templateUrl: 'templates/menuscreen.html',
}
}
})
MenuScreen.html
<ion-view>
<ion-content has-bouncing="false">
<div class="button-box">
<h2>Would you like to?</h2>
<!--Button-->
<div class="btn-box">
<div class="btn-parent-box">
<div class="icon">
<i class="ion-ios-plus-outline"></i>
</div>
<button class="button button-full btn-orange" type="submit"
ui-sref="newjob" title="New Job">New Job</button>
<div class="clearfix"></div>
</div>
</div>
<!--/button-->
</div>
</ion-content>
</ion-view>
Upvotes: 0
Views: 2496
Reputation: 941
Instead of using menu-close better to user menu-toggle="left" / menu-toggle="right" based on your menu have and you can use that button event for some code. What all you have to do is,
<button class="button button-full btn-orange" type="submit" menu-toggle="left" ui-sref="newjob" title="New Job">New Job</button>
in the menu, what ever so called list is add
menu-toggle="left".
that's it. And you can able to perform all operation.
If correct vote for it.
Upvotes: 1