Select One option and onChange event will display the value of selected option.
<div ng-app="my_app" ng-controller="my_ctrl">
<select ng-model="students" ng-options="x.name for x in details">
</select>
</div>
<br><br>
<script>
var app = angular.module('my_app', []);
app.controller('my_ctrl', function($scope, $http) {
$http.get("student-data.php") // data source for options
.then(function (response) {$scope.details = response.data.student_data;});
});
</script>
Using PDO
The variable $dbo is declared inside the database connection file config.php, read more on PDO connection and config file here.
<?php
require "config.php"; // database connection
$sql="SELECT id, name ,class ,mark FROM student LIMIT 0,10";
$row=$dbo->prepare($sql);
$row->execute();
$result=array('student_data'=>$row->fetchAll(PDO::FETCH_ASSOC));
echo json_encode($result);
?>
You can check the output ( in JSON format ) of student-data.php file here.
← Dropdown List Box
←DEMO: Options using JSON format ←DEMO: OnChange Event