Hi i am new to Angular.js and i am learning it through the tutorials present in Angular.js site,
-- this is the code which i tried, it is as follows
<!DOCTYPE html> <html ng-app="SmartPhoneApp"> <head> <title>Smart phone Angular</title> <script type="text/javascript" src="D:/Rahul Shivsharan/Installers/AngularJS/angular.js"></script> <script type="text/javascript"> var smartPhoneApp = angular.module("SmartPhoneApp",[]); smartPhoneApp.controller("phoneCtrl",function($scope){ $scope.phones = [ { "modelName" : "LUMIA 520", "companyName" : "NOKIA" }, { "modelName" : "GALAXY S Series", "companyName" : "SAMSUNG" }, { "modelName" : "CANVAS", "companyName" : "MICROMAX" }, { "modelName" : "OPTIMUS", "companyName" : "LG" } ]; }); </script> </head> <body> Search by Model Name : <input ng-model="comp.modelName" /> Search by Company : <input ng-model="comp.companyName" /> <div ng-controller="phoneCtrl"> <table ng-repeat="phone in phones | filter: comp"> <tr> <td>{{phone.modelName}}</td> <td>{{phone.companyName}}</td> </tr> </table> </div> </body> </html>in the above code you can see i am able to search the mobile phone details using two input,
by modelName or by company name.
Now i am trying the same search by with different approach,
what if i want to search the data using the filter present in the
select box the code is as follows,
<!DOCTYPE html> <html ng-app="EmployeeApp"> <head> <title>Orderring People</title> <script type="text/javascript" src="D:/Rahul Shivsharan/Installers/AngularJS/angular.js"></script> <script type="text/javascript"> var employeeApp = angular.module("EmployeeApp",[]); employeeApp.controller("empCtrl",function($scope){ $scope.employees = [ { "name" : "Mahesh Pachangane", "company" : "Syntel India Pvt. Ltd", "designation" : "Associate" }, { "name" : "Brijesh Shah", "company" : "Britanica Software Ltd.", "designation" : "Software Engineer" }, { "name" : "Amit Mayekar", "company" : "Apex Solutions", "designation" : "Human Resource" }, { "name" : "Ninad Parte", "company" : "Man-made Solutions", "designation" : "Senior Architect" }, { "name" : "Sunil Shrivastava", "company" : "IBM", "designation" : "Project Lead" }, { "name" : "Pranav Shastri", "company" : "TCS", "designation" : "Senior Software Engineer" }, { "name" : "Madan Naidu", "company" : "KPMG", "designation" : "Senior Associate" }, { "name" : "Amit Gangurde", "company" : "Amazon", "designation" : "Programe Manager" } ]; $scope.orderProp="name"; }); </script> </head> <body ng-controller="empCtrl"> <table> <tr> <td align="right">Search :</td> <td><input ng-model="query" /></td> </tr> <tr> <td align="right">Search By :</td> <td> <select ng-model="query"> <option value="name">NAME</option> <option value="company">COMPANY</option> <option value="designation">DESIGNATION</option> </select> </td> </tr> </table> <hr> <div> <table> <tr> <th>Employee Name</th> <th>Company Name</th> <th>Designation</th> </tr> <tr ng-repeat="emp in employees | filter:query"> <td>{{emp.name}}</td> <td>{{emp.company}}</td> <td>{{emp.designation}}</td> </tr> </table> </div> </body>here in the above code you can see i want to search the employee using the search byoption selected in the select box, but this example don't work, the 'query' does'nt take therequired inputcan you please help me out in this,
You received this message because you are subscribed to the Google Groups "JavaScript Forum" group.
To unsubscribe from this group and stop receiving emails from it, send an email to javascript-information+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.