I have ng-repeat with items from my scope. Each row has a checkbox. When I click on the button which is outside ng-repeat it should call function from controller and from there I need to know know which checkboxes were selected and get their original scope values. I'm able to get selected checkboxes within controller with
$("input:checkbox:checked")
but how can I access it's original scope values (for rows which were selected)?
Thank you in advance.
Never do DOM manipulation in your controller.
The better ways would be
to add items in an array within your controller on selecting, and then on button-click, process the items in the array via a controller method, or
Set a boolean property on each item to true on selection, and then on button-click, process items with that boolean property set to true.
If you give us a jsFiddle for your situation, I or somebody else can give you more details.
Here is a fiddle http://jsfiddle.net/e6NPw/1/
I have a $scope.selected object on the scope and I keep the ids as keys. After that in your function outside your ng-repeat you can pretty much do anything you want, I just make an array of objects like the $scope.results but only with the selected ones.
Related
I have a collection of objects that AngularJS filters by a text search within a title property on each object.
After this filter has run, I am left with a set of items that matches this filter.
I would like to iterate over this subset of the list, after clicking a button, and change a property on the items that match this filter.
Is there an easy way to do this in AngularJS, or am I going to be doing this outside Angular and then updating the state manually in the controller?
When the user clicks the button you can get this values and make some change. But I think you need do it inside your controller.
It appears that within an ng-repeat you can do the following
item in items | filter:x as results will store the fragment of the repeated items as results, but only after the items have been processed through the filter.
I have an app where I display callback results in a table.
I'm trying to figure out how to highlight a row that I click on when I display details for that record.
I thought it might be possible using the $event method and applying a class change based on a property returned there.
Any suggestions would be great!
You could use the ngClass directive on the row to set a class depending upon the value of a scope variable. Then use ngClick on the row to set the value of that scope variable.
<tr ng-class="{'highlight':activeRow===0 }" ng-click="rowClick(0)">
I have created a fiddle here
This forked Plunker shows two ng-repeats each displaying an array as a list. Each list item uses a custom directive to animate whenever an up or down arrow is clicked.
The first list, which records changes to array item values animates correctly but the second, which records changes to array item indexes does not.
Can anybody suggest how to edit the directive to animate the second list correctly?
The way you move the elements triggers incorrect animation. Try to do it like this
function arrayMove(arrayVar, from, to) {
var item = arrayVar.splice(from, 1).pop();
arrayVar.splice(to, 0, angular.copy(item));
}
You need to make a (deep) copy of the element to preserve some properties like $$hashkey used by AngularJS to track the objects.
I am binding an object from my controller on a directive in that controller. I can update fields from the directive on ngModel, however I cant seem to add or delete items from an existing property of type Array on that ngModel. It doesnt reflect on the value assigend to ngModel on the controller.
Editing a simple (existing) property of type Number or String is possible.
Could use some guidance on this.
If you could show some of your code, it would be helpful. However, from what you describe, I suspect it might be possible that you are not referencing either the array or the elements in the array correctly.
I have a checkbox (bound to a model), placed inside an ng-repeat tag which iterates over a list.
I want to send a value "YES" or "NO" depending on whether the box is checked or not to the controller using the ng-true-value and ng-false-value attributes.
But for some reason, the $scope.value2 is not getting updated in the controller.
Here is a jsFiddle with my problem:: http://jsfiddle.net/HmvgW/
Note: If I place the checkbox outside the ng-repeat tag, the YES/NO value is sent correctly to the controller.
How do I send a value to checkbox clicked value to the controller if I place it inside the ng-repeat tag?
Thanks!
It's a scope issue. ng-repeat creates a new child scope with each loop. If you want to access the parent scope from within the child, you can do so with $parent.value2.