I have a page that has a navbar on it. when you click on a button in the navbar it should redirect you to a search page, and open a modal dialog. I'm not sure what I'm doing wrong, but it won't redirect to the page I've specified in the ng-click directive and the modal only opens when it has the search page open. Here's my button in the navbar
<button class="btn default-btn advancedbtn" data-toggle="modal" data-target="#myModal" ng-click="redirect()">Advanced</button>
Here's the code to redirect in my controller:
$scope.redirect = function () {
$location.url('/search');
}
I'm probably going about this in the wrong way. If any other code is needed let me know. Thanks.
Related
This link in the menu brings me to the dashboard. If I am on the dashboard and I click the link. The window scrolls to the section of the page I need it to go to. However, if I am on another page and I click this link it redirects but does not scroll to the specific section of the page. What can I do to get it to scroll when I am coming from another page other than the dashboard?
<li><a href ng-click="scrollToSection()" highlight=".content"><i class="fa fa-bell"></i>Click here</a></li>
$scope.scrollToSection = function(){
redirectServices.goToPage();
$window.scrollTo(0, 800);
}
Ionic v1
I was using ui-sref to simply navigate from one page to another in my ionic app, but recently have to switch to $state.go because pressing button closes the app. I figured it out that states are not maintained in ui-sref.
So my question is do I have to always use $state.go if I just want to simply navigate between pages without closing my app and create a separate function in controller to go to next page.
Code for ref
<button class=" button button-assertive" ui-sref="nextPage">Next</a>
or
<button class=" button button-assertive" ng-click="gotonext()">Next</a>
JS
$scope.gotonext = function(){
$state.go('nextPage')
};
Try this :-
$scope.gotonext = function(){
$location.path("/nextPage");
};
I want my a modal popup before my ng-click gets executed. But only the ng-click is executing, no pop up is displaying.
<a class="btn btn-primary" data-toggle="modal" data-target="#addNewMapping" ng-click="onClickGenerate()">Generate Document</a>
addNewMapping is a div on the same view and onClickGenerate is a method on the correspnding controller.
I ended up displaying a modal popup using data-target and in the modal popup added a button to handle the ng-click event.
I am using the angular-bootstrap in AngularJS, because I want to use dialogs. In my HTML I have the following code:
<script type="text/ng-template" id="create.html">
<div class="modal-header">
<h3 class="modal-title">Welcome!</h3>
</div>
<div class="modal-body">
<p>Hi</p>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="ok()">OK</button>
</div>
The modal dialog shows up, but nothing happen when I click on the "OK" button.
There is also no error in the console. When I create a button and place it outside the script, then it works. But I need to use the button in the modal dialog.
I have created a factory for the modal dialog, because I want to use it in my controller. Here the function what works fine:
$scope.createGame = function(data){
// Open the modal dialog
ModalFactory.open();
}
Now the modal dialog shows up and the button "OK" appears. When I click on "OK" nothing happen. This is the function I have created for the "OK" button.
$scope.ok = function(data){
// Close the modal dialog
alert("Test");
}
But the triggering of ng-click in that script what you see above doesn't work...
Your function requires a parameter "data" but you are not passing it.
<button class="btn btn-primary" ng-click="ok()">OK</button>
Either Change your function signature like this,
$scope.ok = function(){
// Close the modal dialog
alert("Test");
}
Or Pass the data.
It's always use a different function name rather than just "ok"
I'm making a functional button in my ionic app, and I want to know what I need to do to make a button centered on a blank ionic app load another page when clicked.
I have experimented with adding ng-click="loadPage()" to the button in my index.html file. I defined
$scope.loadPage = function() { $state.go(page.html)} in my controller.
switch your button with an anchor
<a class="btn btn-full" ui-sref="your.state">your text</a>