angularjs - Angular: How to perform search on button click -
this sample code user write data in textbox , result filter accordingly how can filter data clicking button?
<div ng-app="myapp" ng-controller="mycontroller"> <label>field: <select ng-model="selectedfieldname"> <option value="">--select account--</option> <option ng-repeat="(fieldname,fieldvalue) in customer[0]" ng-value="fieldname | uppercase">{{fieldname | uppercase}}</option> </select> </label> <label>data: <input ng-model="searchtext"></label> <table class="table table-striped table-bordered"> <tr> <td>id</td> <td>first name</td> <td>last name</td> <td>salary</td> <td>date of birth</td> <td>city</td> <td>phone</td> </tr> <tr ng-repeat="item in customer | filter:searchlist "> <!-- orderby:'$index':false --> <td>{{ item.id }}</td> <td>{{ item.firstname }}</td> <td>{{ item.lastname }}</td> <td>{{ item.salary }}</td> <td>{{ item.dob }}</td> <td>{{ item.city }}</td> <td>{{ item.phone }}</td> </tr> </table> </div> ;var myapp = angular.module('myapp', []); myapp.controller('mycontroller', function mycontroller($scope) { $scope.selectedfieldname=''; $scope.searchtext=''; $scope.searchlist = function(row) { if ($scope.selectedfieldname && $scope.searchtext) { var propval = row[$scope.selectedfieldname.tolowercase()]+ ''; if (propval) { return propval.touppercase().indexof($scope.searchtext.touppercase()) > -1; } else { return false; } } return true; }; $scope.customer = [ { 'id': 1, 'firstname': 'tridip', 'lastname': 'bhattacharjee', 'salary' : 15000, 'dob': '05/09/2013', 'city': 'kolkata', 'phone': '033 2589 7415' }, { 'id': 2, 'firstname': 'arijit', 'lastname': 'banerjee', 'salary' : 25000, 'dob': '01/09/2010', 'city': 'bihar', 'phone': '033 2589 9999' }, { 'id': 3, 'firstname': 'dibyendu', 'lastname': 'saha', 'salary' : 20000, 'dob': '06/09/2011', 'city': 'rachi', 'phone': '033 2589 3333' }, { 'id': 4, 'firstname': 'bisu', 'lastname': 'das', 'salary' : 5000, 'dob': '05/01/2009', 'city': 'silchar', 'phone': '033 2589 2222' }, { 'id': 5, 'firstname': 'soumyajit', 'lastname': 'kar', 'salary' : 12000, 'dob': '09/08/2011', 'city': 'kanpur', 'phone': '033 3333 1894' } ]; })
please see code , tell if add 1 button how trigger custom filter when user click on button after write data in textbox search. looking guide line. thanks
you create filter object upon click.
<input ng-model="searchtext"></label> <button ng-click="submitfilter()" class="search-button">submit</button>
and in controller:
$scope.submitfilter(){ $scope.searchlist = $scope.searchtext; }
Comments
Post a Comment