function addSelected(id) {
var feedFound = false;
var selList = [] ;
for (var i = 0; i < vm.feeds.length; i++) {
if (vm.feeds[i].id == id) {
if (vm.rationList.length > 0) {
for (var j = 0; j < vm.rationList.length; j++) {
if (vm.feeds[i].id == vm.rationList[j].id) {
feedFound = true;
break;
}
}
}
if (!feedFound) {
selList.push(vm.feeds[i]);
vm.feeds[i] = vm.feeds.filter(function(item) {
return item.id === vm.feeds[i].id;
});
}
feedFound = false;
}
}
var li = [];
angular.copy(selList, li);
for (var i = 0; i < li.length; i++) {
vm.rationList.push(li[i]);
}
vm.rationListSafe = vm.rationList;
}
This is how i add elements from one list to another with filtering. The problem is, for each filtered element, I get back an empty array. Is there anyway I can solve this?
If you are looking for only one item in your array, use find() instead of filter()
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find
PS: find may return null so you should always null-check
Example:
const foundItem = vm.feeds.find(function(item) {
return item.id === vm.feeds[i].id;
});
if (foundItem) {
vm.feeds[i] = foundItem
}
I'm trying to fix my ngdupes error with the checkbox selection. I don't know what's going wrong. Can someone please help? Here is my code:
$scope.GetMultiCheckBox = function GetMultiCheckBox(CheckBoxs) {
var idx = $scope.selectedfunction.indexOf(CheckBoxs);
if (idx > -1) {
$scope.selectedfunction.splice(idx, 1);
}
else {
$scope.selectedfunction.push(CheckBoxs);
}
};
$scope.FilterValueByFunction = function (FunctionVal) {
$scope.Lv7 = [];
if (!$scope.selectedfunction.length == '') {
for (var i = 0; i < $scope.LoadAllData.length; i++) {
for (var j = 0; j < $scope.selectedfunction.length; j++) {
if ($scope.LoadAllData[i].Business_x0020_Checkbox.results.toString().match($scope.selectedfunction[j])) {
$scope.Lv7.push($scope.LoadAllData[i]);
}
}
}
} else {
for (var i = 0; i < $scope.LoadAllData.length; i++) {
$scope.Lv7.push($scope.LoadAllData[i]);
}
}
};
Here is my HTML code for checkboxes:
<ul><li ng-repeat="item in functions">
<input id="{{item}}" type="checkbox" value="{{item}}" ng-disabled="Site.length == 0"
ng-checked="selectedFunction.indexOf(item) > -1"
ng-click="GetMultiCheckBox(item); FilterValueByFunction(item);" autocomplete="off"/></li></ul>
This is the code for the whole data getting filtered based on choices:
<div ng-repeat="item in Lv8|orderBy: 'Category'| filter: SiteFilter
|groupBy: 'Category' | filter: searchBox">
<div id="grad1" ng-show="item.Category_CHANGED">{{item.Category}}
</div>
Thanks!
i have list of subjects with checkbox.when user submit selected subjects i am getting properly but i need to make like this if user selected 3subjects(Tamil,Science,English) i want to declare like this var data = {"Subject" :[{subject0:Tamil,subject1:Science,subject3:English}]} someone help me out how to make . i have enclosed my html and controller
.controller('TestController', ['$scope','$http','$window','$location', function($scope,$http,$window,$location,$stateProvider)
{
var serverData = ["Tamil", "Science", "English","computer"];
$scope.items = [];
for (var i = 0; i < serverData.length; i++) {
var modal = {
name: serverData[i],
selected: false
};
$scope.items.push(modal);
}
$scope.submit = function()
{
var checkedItems = [];
for (var i = 0; i < $scope.items.length; i++) {
if ($scope.items[i].selected)
{
checkedItems.push($scope.items[i].name);
}
}
console.log(checkedItems);
//Expectation:
//var data = {
//"Subject" :[{subject0:Tamil,subject1:Science,subject3:English}]
//}
}]);
}
<div ng-controller="TestController">
<ul ng-repeat="item in items">
<li class="item item-checkbox">
<label class="checkbox checkbox-energized">
<input type="checkbox" ng-model="item.selected" >
</label>
{{item.name}}
</li>
</ul>
<input type="button" name="submit" value="submit" ng-click="submit()"/>
</div>
Try below :
$scope.submit = function()
{
var checkedItems = [], data = [];
for (var i = 0; i < $scope.items.length; i++) {
if ($scope.items[i].selected)
checkedItems.push("Subject"+i, $scope.items[i].name);
}
data.push("Subject", checkedItems);
}
You could simply do like this.
$scope.submit = function() {
var checkedItems = [], data = {};
for (var i = 0; i < $scope.items.length; i++) {
if ($scope.items[i].selected)
checkedItems["Subject" + i] = $scope.items[i].name;
}
data["Subject"] = checkedItems;
console.log(data); // {"Subject" :[{subject0:Tamil,subject1:Science,subject3:English}]}
}
I make it bit more angular way
<div ng-controller="ControllerZero">
{{data.Subject}}
<ul ng-repeat="item in serverData">
<li class="item item-checkbox">
<label class="checkbox checkbox-energized">
<input type="checkbox" ng-model="$parent.subject[$index]">
</label>{{item}}</li>
</ul>
<input type="button" ng-click="showData()" value="show data">
</div>
javascript :
var myModule = angular.module('myModule', []);
function ControllerZero($scope, Timer) {
$scope.serverData = ["Tamil", "Science", "English", "computer"];
$scope.subject = [];
$scope.data = {'Subject' : [{}]};
$scope.showData = function() {
var count = 0;
$scope.data.Subject[0] = {};
angular.forEach($scope.subject, function(value, key) {
if(value === true) {
$scope.data.Subject[0]['subject' + count] = $scope.serverData[key];
count++;
}
})
}
}
ControllerZero.$inject = ['$scope'];
fiddle link : http://fiddle.jshell.net/55zjjyhk/
or you can make it become realtime by put $watch, but seems that unnecessary.
when i go to page i need always checked somecheck boxes like software or harware.if any one selected then only submit button will visible.if nothing is selected submit button should disable and alert should come please select some services
function Test1Controller($scope) {
var storeid = window.localStorage.getItem("storeid");
var serverData = ["software", "hardware", "Accessories"];
$scope.items = [];
for (var i = 0; i < serverData.length; i++) {
var modal = {
name: serverData[i],
selected: i === 0 ? true : false,
};
$scope.items.push(modal);
}
$scope.check = function() {
var checkedItems = [];
for (var i = 0; i < $scope.items.length; i++) {
if ($scope.items[i].selected) {
checkedItems.push($scope.items[i].name);
}
}
console.log(checkedItems);
}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<div ng-app>
<div ng-controller="Test1Controller">
<div ng-repeat="item in items">
<input type="checkbox" ng-model="item.selected" />{{item.name}}
</div>
<input type="button" name="submit" value="submit" ng-click="check()" />
</div>
</div>
function Test1Controller($scope) {
var storeid = window.localStorage.getItem("storeid");
var serverData = ["software", "hardware", "Accessories"];
$scope.items = [];
for (var i = 0; i < serverData.length; i++) {
var selectVal = false;
if(serverData[i] === "hardware"){
selectVal = true;
}
var modal = {
name: serverData[i],
selected: selectVal
};
$scope.items.push(modal);
}
}
I have a checkbox which bind with a ng-model:
<input type="checkbox" ng-change="toggleAll(globalChecked)" ng-model="globalChecked">
Whereas toggleAll will grab the globalChecked value and process other logic in my controller:
$scope.toggleAll = function(val) {
if ($scope.objects == undefined) {
return
}
for (var i = 0; i < $scope.objects.length; ++i) {
$scope.objects[i].checked = val;
}
}
However, for the firs time, when I click the checkbox, toggleAll get called but the val (or globalChecked value) is still false.
Just wonder did I miss anything here?
It seems you didn't miss anything, it works fine for me. Here is a sample plunker:
http://plnkr.co/edit/BbVs7pEEFGTunXVkxCMj?p=preview
If it doesn't work the first time, make sure to initialize the value of the first checkbox (ng-model="globalChecked" in your code).
<input type='checkbox' ng-click="checkAll(toplevel)" ng-model="toplevel">
<div ng-repeat="obj in objects">
<input type='checkbox' ng-model="obj.checked">
</div>
$scope.objects = [];
for(var i = 0; i < 100; i++) {
if (!$scope.objects[i])
$scope.objects[i] = {checked: false};
}
$scope.checkAll = function(val){
for(var i = 0; i < 100; i++){
console.log($scope.objects[i]);
$scope.objects[i].checked = val;
}
}