Applying Filter using user input while displaying records

Basics of Angular
Our sample student table database records are available here in JSON format. We will ask user to enter any text and based on this input we will dynamically change the filter to return matching rows.

The filter is applied to name column only.

{{ x.id }}{{ x.name }}{{ x.class }}{{ x.mark }}{{ x.gender }}
Basics of Angular: reading JSON
<div ng-app="my_app" ng-controller="studentCtrl">
<p><input type="text" ng-model="s_name"></p>
<table>
  <tr ng-repeat="x in details | filter :{'name':s_name}">
    <td>{{ x.id }}</td><td>{{ x.name }}</td><td>{{ x.class }}</td><td>{{ x.mark }}</td>
	<td>{{ x.gender }}</td>
  </tr>
</table>

</div>

<script>
var app = angular.module('my_app', []);
app.controller('studentCtrl', function($scope, $http) {
  $http.get("../php_tutorial/student.json")
  .then(function (response) {$scope.details = response.data;});
});
</script>
Basics of Angular Basics of Angular
Angular Home

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-2021 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer