FAQ Database Discussion Community


Ng-click - does the order matter when calling multiple methods?

javascript,angularjs,angularjs-ng-click
When calling multiple methods with ng-click, as in ng-click="select(); highlight()" do they get executed in order, i.e. first select() and then highlight()?...

ng-click value change + $scope.watch bind not working properly

javascript,angularjs,angularjs-scope,angularjs-ng-click,angularjs-watch
I have a scope variable '$scope.searchType' which is equal to 'createdAt' by default. In my HTML I have options that change the scope variable value: <ul class="dropdown-menu" role="menu"> <li><a ng-click="searchType = 'Anything'">Anything</a></li> <li><a ng-click="searchType = 'Payment'">Payment</a></li> <li><a ng-click="searchType = 'Total'">Total</a></li> <li><a ng-click="searchType = 'Tax'">Tax</a></li> <li><a...

ng-click used inside ng-grid

angularjs,ng-grid,angularjs-ng-click
I'm hoping you can help me figure out how to merge my ng-click event into my code. I've been trying to figure it out all weekend. I found this ng-click event jsfiddle: http://jsfiddle.net/nisham/09k8f5s4/97/ that I want to use inside my project. I want users to be able to see the...

How to display an image or pdf file on new tab in angular js?

javascript,asp.net-mvc,angularjs,angularjs-ng-click
Below is my page: Now when i click on Capture1.png i want to first display that image on new tab without any pop up as shown in my above picture. Same way when i click on sample.pdf i want to first display pdf on new tab. This is my html:...

Angular: Use ng-click to auto fill/change data stored inside ng-grid

javascript,angularjs,ng-grid,angularjs-ng-click
I am new to angular. I have a simple page with a ng-grid that displays days and times. The idea is a driver is on the page and can click for each time slot whether his is available at the time to volunteer driving (Y, or N). Currently you can...

Changing scope variable on ng-click without calling a function

javascript,angularjs,operators,angularjs-ng-click,angular-ng-if
How can I change a Scope Variable without calling a function from controller. I'm trying to show a div content when the editState variable equals to 1 but it's not working. HTML <body data-ng-controller="profileCtrl as pctrl"> <div data-ng-click="pctrl.editState === 1">Edit</div> <div data-ng-if="pctrl.editState === 1"> ..... </div> </body> JS(in profileCtrl controller)...

ng-click / ng-class combination not working as expected with $index

angularjs,angularjs-ng-click,ng-class
For some reason my ng-click / ng-class combination is not working. On click the class 'hide' has to be added based on the equality of the productDisplay variable. <div ng-repeat="product in project.data track by $index"> <p ng-click="productDisplay = $index"><strong>{{product.name}}</strong></p> <div class="fileList" ng-class="{'hide': productDisplay !== $index}">{{$index}}</div> I can click on the...

append a html include ng-click in angularjs

angularjs,angularjs-ng-click
i have this code in mycontroller i will add this html() to my html, all it right just ng-click dos not work ! have you an ideas why ng-click dos not work var html='<div ng-click="selectedValue('+Value+')">Value</div>' ; $('#myDiv').html(html); $scope.selectedValue = function(value){ $scope.val =value; }; i have to slect the value displayed...

ng-click doesn't open new windows

javascript,html,angularjs,angularjs-ng-click
I have a table in which the last column contains buttons that should open a new window but they don't. Here is my code: <table class="table table-hover" id="angular_table"> <thead> <tr> <th class="company">Nome azienda&nbsp;<a ng-click="sort_by('company')"><i class="icon-sort"></i></a></th> <th class="code">Codice&nbsp;<a ng-click="sort_by('code')"><i class="icon-sort"></i></a></th> <th class="projectName">Nome...

How to fix this ng-class toggle comparison?

javascript,angularjs,angularjs-ng-repeat,angularjs-ng-click,angularjs-ng-class
http://plnkr.co/edit/7v63GXSIDon1QKm1GXCE?p=preview I have an array which stores the name of each button that is clicked. Once clicked the object is placed into array, I use ng-class to check if the name of the object in the array is the same as the model used to create the button. Then if...

Can I set a variable inside ng-repeat?

javascript,html,angularjs,angularjs-ng-repeat,angularjs-ng-click
I have an application that has two forms that are lists of buttons and a form with a list of labels. I choose a person, choose a phone, and on the third form I show a list of phones and their associated people (location). Is it possible to set a...

angular: calling a function with parameter using ng-click inside directive template

angularjs,angularjs-directive,angularjs-ng-click
new to angular here :) I have a custom directive that have an ng-click in it which calls a function I have defined in a controller (not the directive controller). This is the html view: <course-pass course-id="bla"/> This is the directive: scotchApp.directive("coursePass", function($compile) { return { restrict: "E", controller: 'dropdownCtrl',...

ng-click first apply class, then execute function

angularjs,function,angularjs-ng-repeat,angularjs-ng-click,delayed-execution
I have a shopping cart (a rootScope array) which gets turned into a list of items in it, including a button to delete that item from the cart array (the red X). I don't have enough reputation to add an image, so here's a link to what it looks like...

How to print (on ng-click) an item of a ng-repeat outside the loop?

angularjs,angularjs-ng-click
I have a simple array of objects {name,age} (see my jsfiddle). I use an ng-repeat to print all the names and I would like to print, outside the ng-repeat loop, the age of the name on which I click. <body ng-app="myapp"> <div ng-controller="MyController" > <ul> <li ng-repeat="friend in myData.friends" ng-click="myData.doClick($index)">{{friend.name}}</li>...

ng-click not working in ion-scroll even when all $scope variables are in an object

angularjs,ionic-framework,angularjs-ng-click
I have created a plnkr for this problem. I can't get the ng-click to work on this page. I thought I could solve this issue, with the answers I got from this question: Why do I need $parent to enable the function in ng-click when using ion-scroll? But even when...

With angularjs, how can I trigger a click, or is there a better way?

angularjs,angularjs-ng-click
I'm creating a form wizard with AngularJS. Think of each fieldset like so: <div ng-controller="MyController as fs"> <fieldset> ... <button ng-click="fs.StepForward($event)">Next</button> </fieldset> <fieldset> ... <button ng-click="fs.StepBackward($event)">Previous</button> <button ng-click="fs.StepForward($event)">Next</button> </fieldset> </div> What I've done is, in my controller found the current fieldset and the next fieldset like so: app.controller("MyController",...

Function in AngularJS controller not being called

angularjs,angularjs-controller,angularjs-ng-click
I am trying to call a function from my AngularJS controller with the following code: Controller Code (function () { var hello = angular.module("helloApp", []); hello.controller("HelloCtrl", ["$http", "$scope", function($scope, $http) { console.log("in controller"); $scope.test = function() { console.log("in test function"); $http.get("/test").success(function(data) { console.log("success"); }) .error(function(data) { console.log("error"); }); }; }...

Method display on the scope is not executed

angularjs,angularjs-scope,angularjs-ng-click,angularjs-ng-show
I have a set of directives that share a scope Update: The code is available as a plunk here http://plnkr.co/edit/JZ77bsZgGrw6N4K718Is?p=preview todo-item: app.directive("todoItem",function(DeleteTodo,$log){ var dirDefObj = { restrict:'E', templateUrl:'app/templates/todo.html', scope:{ todo:'=value' }, controller:function($scope){}, replace:true }; return dirDefObj; }); template: <div class="ui card"> <todo-formui ng-show="todo.editMode"></todo-formui> <todo-cardui ng-show="!todo.editMode"></todo-cardui>...

AngularJs - Send data in ng-click to validate email

angularjs,angularjs-ng-click
I'm trying to check if the inserted email is in a valid format so I can choose what to do next. I'm trying to achieve this by sending myForm.$valid value inside the function that runs when the user hits the button to submit the email. Here is how I'm trying...

Angular js form submits when it shouldn't

javascript,angularjs,angularjs-ng-click,ng-submit
I have an AngularJS form which looks like this: <form ng-submit="vm.update(vm.model)"> .. fields <button ng-click="vm.addCluster()">Add</button> .. more fields <input type="submit" value="Save" /> </form> When I click submit it works as expected - update() method is called. When I click the button it calls addCluster() but after that the form gets...

Disable ng-click from outside element on link inside

javascript,angularjs,angular-ui-router,angularjs-ng-click
I have a site using ui-router where I have a table and I have an ng-click on the cells, but have a link inside the cell. I need to disable the ng-click from the cell, when the link is clicked. <div ng-click="click()" style="background: #d3d3d3"> <a ui-sref="about">go to about page</a> </div>...

ng-click swap out button

angularjs,angularjs-ng-click
When a user clicks on "Save Changes" I'm wanting to change the inner copy to "Confirm Changes" and then once they confirm the submit button works as per. I'm unsure of how to achieve this using angular. Here is my code so far: <div class="col-xs-12"> <p> <button type="submit" class="vfnz-submit">Save changes</button>...

Angular fire ng-click on row but not on href

html,angularjs,twitter-bootstrap,events,angularjs-ng-click
I've made a page with bootstrap, and i would like to have an action when the user clicks on the row. This is easy, I put ng-click on the div that is the row. However, inside the row elements I've a link, and I would like to avoid the firing...

After changing my List vom ng-repeat to collection-repeat ng-click is not working properly

javascript,angularjs,ionic-framework,ionic,angularjs-ng-click
I had a List like this: <ion-item ng-repeat="item in items" ng-click="itemClick({{item[0]}})"> ... </ion-item> now I changed it to: <ion-item collection-repeat="item in items" ng-click="itemClick({{item[0]}})"> ... </ion-item> while having the following code in my controller: $scope.itemClick = function (index) { // index is undefined }; before making the change from ng-repeat to...

Click event on glypicon

angularjs,twitter-bootstrap-3,angularjs-ng-click
How do I add a ng-click event to a bootstrap glyphicon in a textbox? The event doesn't get fired... <body ng-app ng-init="mymodel='THIS IS MY MODEL'"> <h3>How to clear the model on remove icon click?</h3> <div class="container"> <div class="form-group has-feedback" > <input type="text" class="form-control" ng-model="mymodel"/> <i class="glyphicon glyphicon-remove form-control-feedback" ng-show="mymodel" ng-click="mymodel...

How I can delegate a click event in angular?

angularjs,delegates,angularjs-ng-click,angular-directive
How can delegate a click event on my board, what I do is I tell element to find element with the class open-preview And I can not do it like I do. Because the li is created dynamically in ruby loop. I do not know how I can delegate a...

AngularJs ng-click not working directive

javascript,html,angularjs,angularjs-directive,angularjs-ng-click
When I click on my HTML img, ng-click doesn't work. I don't understand why. This error happens in masonryPictureView.html Main page - home.html <ng-masonry> <ng-picture ng-items="projectdescription.pictures"></ng-picture> </ng-masonry> Template of directive ngPicture - masonryPictureView.html <ul class="grille"> <li ng-repeat="item in ngItems"> <img ng-click="test()" src="{{item.img}}"/> <------ NG-CLICK </li> </ul> Directive in home.html app.directive('ngMasonry',...

Switching between tabs in modal in angular

angularjs,twitter-bootstrap,angularjs-scope,bootstrap-modal,angularjs-ng-click
I have a login and a signup form that opens in a modal. At the top I have two tabs switching between login and signup. see picture Switching between the tabs works fine. However, I want the user to be able to choose login as well as signup on my...

How to call ng-repeat sort by predicate code from Controller?

javascript,angularjs,angularjs-ng-repeat,angularjs-ng-click
I have 2 directives, 1 controls the view for a list of tags and contains a couple of sort buttons and the other a popover menu with the same options: Markup for tagPanel: <header> <ul> <li ng-class="{'active':vol}" ng-click="vol = true; predicate = 'week_quantity'; reverse=!reverse">Vol</li> <li ng-class="{'active':!vol}" ng-click="vol = false; predicate...

How to close out all popovers on body click in Angular?

javascript,angularjs,angularjs-scope,angularjs-ng-click
http://plnkr.co/edit/hqXGl47EJ0wVaEgoXk3X?p=preview I'm trying to find the best way to accomplish this. Basically there are several popovers we have in our app, for fuzzy search, additional options, help tips etc etc. When any of them are open, they need to be closeable if the user clicks anywhere else outside of it,...

How to prevent a ng-click event on a div in a sub controller from triggering an ng-click in the root?

javascript,angularjs,angularjs-scope,angularjs-ng-click
http://plnkr.co/edit/gB7MtVOOHH0FBJYa6P8t?p=preview I have a parent child controller example above, in the child when a button is clicked I displays the div showPop and then will $emit an event upwards to the $rootScope. Now in the parent / $rootScope I "hear" that event then activate another function. That function in the...

Angular.js change location ng-click

javascript,angularjs,angularjs-ng-click
I've read some other posts on the same topic but cannot get my own to work. Basically, I want the location of my app to change on a ng-click event. So I have html code that looks like this: <button class="button icon-left ion-plus-round button-block button-calm" ng-click="send({{foods.cal}})"> Add Calories </button> And...

How to correctly watch for clicks outside an element?

javascript,angularjs,angularjs-ng-click,ng-show
When I click on "Add New Item" button I want a popup form to be displayed. Then if I click outside this form I want it to hide itself. To show/hide form I use ng-show directive. To watch for outside clicks I use third-party Angular directive angular-clickout But there is...

Toggle class between two buttons in Angular but restrict to prevent same button from changing class

javascript,angularjs,angularjs-ng-click,ng-class
Trying to create some very basic functionality which basically makes two buttons behave like radio buttons. Have two buttons that are used to show/hide different content based on what is shown. So it is working as expected except for it is changing on any click. So if I click the...

AngularJS - Filter view by month with ng-click

angularjs,date,filter,angularjs-ng-click
I would like to filter my view with a simple link. I have several objects which all contain a date. Eg. If I click March only data with "Startdate" March should be displayed. I searched the web but found nothing which worked for me. This is my json object and...

How to mark a radio button as checked in Angular with ng-click / ng-change?

javascript,angularjs,angularjs-ng-click
http://plnkr.co/edit/rXWUUjLtJi79z2hF1uVX?p=preview I have a very simple plnkr, basically when the li elements are clicked I want the radio buttons checked. How is this accomplished below? Right now no radio gets selected. If I remove the ng-click, then the user can just click the radio buttons, but I also want the...

angular filter with ng-click + input

angularjs,filter,angularjs-ng-repeat,angularjs-ng-click
how can I get a filter with ng-click out of an ul as second filter for an ngtable? <ul class="artGroups"> <li class="" ng-repeat="artGroup in artGroups"> <a href="#" ng-click="">{{artGroup.artGroupName}}</a> </li> </ul> Here's a plnkr: http://plnkr.co/edit/Amdx2BzEWQWVYmRAgTMw...

Using ng-click inside np-repeat

angularjs,angularjs-scope,angularjs-ng-repeat,model-binding,angularjs-ng-click
I'm trying to implement a shortlisting functionality in a case where I'm using ng-click inside ng-repeat. While the $index is being displayed correctly outside the ng-click, $index is only the index of the last object in the JSON array in all the cases where the html is generated using ng-repeat....

ng-repeat with ng-click inside a directive

angularjs,angularjs-directive,angularjs-scope,ng-repeat,angularjs-ng-click
I am trying to create a simple autocomplete tag directive. But the ng-click on the dropdown menu <li> won't fire. I am sure this is some sort of scope issue, but I don't get why. Can someone please show me how to get this ng-click to fire? thanks! here is...

ng-click is not working - AngularJs

javascript,angularjs,html5,angularjs-ng-click
I have checked all the solutions available here, but it didn't help me. I am trying to display a button from AngularJs to html, but ng-click is not working for <a> or <button> tags. I am working in Eclipse and it contains many built in modules. Please help me out....

Angular ng-repeat $index

javascript,html,angularjs,angularjs-ng-repeat,angularjs-ng-click
I'm creating a list of items the user can click to go to the next picture. <ol class="indicators"> <li ng-repeat="img in pics" ng-click="slideTo($index)"></li> </ol> this code works but the problem is that it doesnt fill in the $index in the ngClick directive. This is the resulting html: <li ng-repeat="img in...

Change selected