Angularjs Filter data with dropdown

Question

I am kinda new in angularjs and javascript so please be kind, I have two dropdown items (Ionic Select) both of them holds data from a service. The issue is that I need to fi

Answer 1

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope,$window, $http) {
   $scope.myFunc = function(x) {
		$scope.name = x.Name;
		$scope.country = x.Country;
		$scope.city = x.City;
		$scope.x = x;
		$("#myModal").modal();
   };
   
   $scope.saveData = function(x) {
		if(x == ''){
			x = angular.copy($scope.names[0]);
			x.Name = $scope.name;
			x.Country = $scope.country;
			x.City = $scope.city;
			$scope.names.push(x);
		}
		else{
			x.Name = $scope.name;
			x.Country = $scope.country;	
			x.City = $scope.city;	
		}
	};
  
  $scope.newData = function() {
		$scope.name = "";
		$scope.country = "";
		$scope.city = "";
		$scope.x = "";
		$("#myModal").modal();
   };

	$scope.myDelete = function(x) {
		if(x.Name=='' && x.Country=='' && x.City==''){
			var index = $scope.names.indexOf(x);
			$scope.names.splice(index, 1);
		}
		else{
			var deletedata = $window.confirm('are you absolutely sure you want to delete?');
			if (deletedata) {
			alert('i am');
				var index = $scope.names.indexOf(x);
				$scope.names.splice(index, 1);    
			}
		}
	};
	$scope.filterExpression = function(x) {
				//alert($scope.country.id);
                return (x.countryId === $scope.country.countryId );
            };
			
   $scope.names =  [{"Name":"Alfreds Futterkiste","City":"","Country":""},{"Name":"Ana Trujillo Emparedados y helados","City":"","Country":""}]
   $scope.countryList = [
        {countryName : "Pakistan", countryId : 1},
        {countryName : "UK", countryId : 2},
        {countryName : "Sweden", countryId : 3}
    ];
	$scope.cityList = [
        {cityName : "Karachi", cityId : 1, countryId:1},
        {cityName : "London", cityId : 2, countryId:11},
        {cityName : "Sweden City", cityId : 3, countryId:3}
    ];
});

  
  
  
  
  
  
  




 
{{names}}
  
Hover Rows
  
The .table-hover class enables a hover state on table rows:
            
  

    

      

        
Sr.No
        
Name
        
Country
		 
City
		
Action
      
    
    

      

        
{{ $index + 1 }}
		
{{ x.Name }}
		
{{ x.Country.countryName }}
		
{{ x.City.cityName }}
		

	 
	
	

		

			

			
			

				
			
		
	
	
  
  
    
  

    

    
      
      

        

          ×
          
Edit Record
		  
Save Record
        
        

        

			Name:
			
		
		

			Country:
			
			
		
		

			City:
			
		
		
        
        

          Save
		  Delete