Drop down with options from JSON formatted values with filter

The options are taken from a set of JSON formatted strings, but while adding as options one filter is applied to show only class Three students for selection.
Selected Student = {{students}} , Selected Mark = {{students.mark}}


<div ng-app="my_app" ng-controller="my_ctrl">
 <select ng-model="students" ng-options=" x.name for x in details | filter :{'class':'Three'}"  >
</select>
<span>Selected Student = {{students}}</span> , 
<span>Selected Mark = {{students.mark}}</span>
</div>
<br><br>

<script>
var app = angular.module('my_app', []);
app.controller('my_ctrl', function($scope, $http) {
	
 $scope.details=[{"id":"1","name":"John Deo","class":"Four","mark":"75"},
{"id":"2","name":"Max Ruin","class":"Three","mark":"85"},
{"id":"3","name":"Arnold","class":"Three","mark":"55"},
{"id":"4","name":"Krish Star","class":"Four","mark":"60"},
{"id":"5","name":"John Mike","class":"Four","mark":"60"}]
 
});
</script>
We have two students of class = Three, so only two options are available for selection as we have applied filter to restrict the options.

Using functions as filters

We can use functions so more conditions can be applied as filters.
DEMO: Filtering Options using functions
DEMO: Options taken from JSON string

Dropdown List Box
DEMO: Options from MySQL database DEMO: Options onChange Event DEMO: onChange Event to post selected option to back end script

Post your comments , suggestion , error , requirements etc here

We use cookies to improve your browsing experience. . Learn more
HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
©2000-2024 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer