I need to keep a menu open when changing url. Right now if I click on View File or Diff the menu hides because the url will have a different path (/files , /diff).
Is there any way to prevent the menu from hiding when the url is changed?
This is my code:
Click to toggle menu
<div ng-show="collapsed">
<div class=container" ng-controller="MenuController" ng-show="show_menu()" ng-init="init_file_ids(number_of_files, selected_files)">
View File |
Diff |
Import |
Toggle chart
</div>
</div>
you want to make sure that collapsed variable is always set false when the pages are initiated. probably you can do that through controllers or from menu's directive controller.
Related
I have a component of header in react and in the same way a component of tabs in another file. I integrate them in app.js . Now I want to change the tabs on click of the header buttons. How could it been possible can anyone help me in this regard.
I have tried it through giving an ID to the tabs and tried to open the tab by calling that ID in href using anchor tag around the tab buttons. But this way can't help me in to open tabs.
https://codesandbox.io/embed/shy-grass-l9n7m
I noticed you are using jQuery to set the tab value. I suggest using React for that with something more like this: https://codesandbox.io/embed/morning-water-dit63
Note: The above code is very rough because I just through it together by modifying your code. For example, I used the active and fade class names to set the visibility of tab content where personally I might have done conditional rendering like this:
render (
// tabs
{this.isActive('home') && (
// tab content here
)}
)
Alternatively you could use a library to handle it like https://reactcommunity.org/react-tabs/
I have the following code that opens up a pop up and displays information returned by the function //showDetails(Data.path)// when we click on the icon.
<a ng-show="Data.path" ng-click="showDetails(Data.path)">
<ng-md-icon icon="info" style="fill: green" size="15"></ng-md-icon>
</a>
I want the data to appear in a md-dialog modal window. Is there an easy way to do that ?
You have to setup a controller which tells $mdDialog what it needs to do when the showDetails(...) function is triggered.
See: https://material.angularjs.org/latest/demo/dialog (Click "View Source" <> icon, and then switch to the "JS" tab to see an example of controller code to use; or just go straight to the Codepen).
If you are using ng-include for your modal, remember Angular creates a new child scope for it. You can acess the data in the modal using the following in your modal HTML:
{{$parent.Data.path}}
i have a big problem. I'm working on a side menu app, and i need to open another view from another view. I tried to use $state.go and $location.go but when i open a window, this window have the back button of the navigation bar. I want the window will open like when i click on a item on my menu, so with the sidemenu icon on left of the nav-bar. What is the method to open a "new window"?
when i open the new view with AngularJS $state.go and $location.path:
1
when i open the same with href="url" in my HTML sidemenu :
2
I need to open the new view like the second screenshot using angularJS. How can i hit it?
If you don't need navigation back button (eventually on condition) you can use this code in your index.html:
<ion-nav-bar class="bar-stable">
<ion-nav-back-button hide-back-button="{{options.hideBackButton}}">
</ion-nav-back-button>
</ion-nav-bar>
When you need to hide the back button set options.hideBackButton = false;
Another way is to use: $ionicNavBarDelegate.showBackButton(false);
Still learning ionic. I have a slide menu integrated into the app. The problem that I have is that I want to completely hide ionic nav bar and menu on top for my login view. I tried using ng-show to hide the nav bar based on whether or not current user is authenticated, but all it does is hide the content in the bar, but leaves empty nav bar container on top of the page.
I also tried using ng-if instead of ng-show, which does make the bar disappear completely, but when I need it to become visible again, the code produces an error: Cannot read property 'outerHtml' of null. I guess because the DOM object for the menu is not there anymore.
What is the best way to address this? Am I on the right path or is there a better way to show/hide
I'm about to kill someone and I'm thinking of the JQM team at the moment. Sigh!
So, clearly I'm doing something stupid.
I've populated a JQM popup div with some info from my database and on first page load, clicking the button with the popup's id as HREF works great!
When I submit the form and return to the same page, it doesn't work. Inspecting the element I see that the ID of the popup is appended with '-placeholder' and the div simply has a comment in it.
Problem: On page reload, I can't click on the HREF that links to the popup (or I can but nothing happens - obviously because the markup has vanished).
Here's the view code of 1. the link to the popup div and 2. the actual pop up div on first and second page load.
Linking to popup:
Browse Database
Original popup div element
<div id="reqform_search_sicnaic" data-role="popup">
<div data-role="header" data-theme="b">
Random Header
</div>
<div data-role="content">
Random content
</div>
</div>
Popup div after form submission / second page load
<div style="display: none;" id="reqform_search_sicnaic-placeholder"><!-- placeholder for reqform_search_sicnaic --></div>
Obviously, I can't open the dialog on page load. :(