Remove an element from array in select menu after selecting anthor Item in anthor dropdown
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
<form>
Xxis
<select ng-model="xcolumn" ng-options=" l1.columnName for l1 in list1" ng-change="getColumn(xcolumn)">
<option value=""></option>
</select>
yAxis
<select ng-model="xcolumn" ng-options=" l2.columnName for l2 in list2" ng-change="getColumn()">
<option value=""></option>
</select>
</form>
</div>
JavaScript
var myApp = angular.module('myApp', []);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
myApp.controller('MyCtrl', function($scope) {
$scope.list1 = [{
"columnName": "part1",
value: "obj1"
}, {
"columnName": "part2",
value: "obj2"
}, {
"columnName": "part3",
value: "obj3"
}, {
"columnName": "part4",
value: "obj4"
}, {
"columnName": "part5",
value: "obj5"
}]
$scope.list2 = [{
"columnName": "part1",
value: "obj1"
}, {
"columnName": "part2",
value: "obj2"
}, {
"columnName": "part3",
value: "obj3"
}, {
"columnName": "part4",
value: "obj4"
}, {
"columnName": "part5",
value: "obj5"
}]
$scope.getColumn = function(colum) {
// console.log(index, 'index of column')
$scope.indexOfcolum = $scope.list2.indexOf(colum);
$scope.removecolum = $scope.list2.splice($scope.indexOfcolum, 1)
console.log($scope.indexOfcolum, 'colum index', $scope.removecolum)
}
});