Reputation: 63
I have a Working Select Option with few values which are filtering data for search.
Now i need few links beside as Sidebar which is helpfull to directly click and change the above Select Options
Please refer to this Link Website Link i made.
Login sample :
User : [email protected]
Pass : kishore
http://proconstruct.co.in/jsearch
Javascript :
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
var json = {
"modules":
<?php echo $qres; ?>
};
$scope.ocw = json;
var allCategories = json.modules.map(function(item) {
return item.designation
});
var filteredCategories = [];
var allCities = json.modules.map(function(item) {
return item.city
});
var filteredCities = [];
allCategories.forEach(function(item) {
if (filteredCategories.indexOf(item) < 0 && item) {
filteredCategories.push(item);
}
});
allCities.forEach(function(item) {
if (filteredCities.indexOf(item) < 0 && item) {
filteredCities.push(item);
}
});
$scope.search = {
designation: ""
}
$scope.search = {
city: ""
}
$scope.categories = filteredCategories;
$scope.updateFilter = function(value) {
$scope.search.designation = value;
}
$scope.cities = filteredCities;
$scope.updateFilter = function(value) {
$scope.search.city = value;
}
});
These are the links html :
<div ng-repeat="designation in categories ">
<a ng-click="updateFilter(search.designation)"> {{designation}}</a>
</div>
This is the Selection which is working and has to react by links :
<select ng-model="search.designation">
<option value="">All Categories</option>
<option ng-repeat="category in categories" value="{{category}}">{{category}}</option>
</select>
Upvotes: 1
Views: 5121
Reputation: 203
From a quick look at your code I would try to change the following:
<div ng-repeat="designation in categories ">
<a ng-click="updateFilter(designation)"> {{designation}}</a>
</div>
The only thing I changed is the parameter for the updateFilter function.
[ UPDATE ]
You have also two functions with the same name: updateFilter
Try this as well:
$scope.search = {
designation: "",
city: ""
}
$scope.updateFilterDesignation = function(value) {
$scope.search.designation = value;
}
$scope.updateFilterCity = function(value) {
$scope.search.city = value;
}
So the link should do: ng-click="updateFilterDesignation(designation)"
This should work hopefully.
Upvotes: 2