Home
Tutorials
Microsoft Technologies Tutorials
Java Programming Tutorials
Web Designing Tutorials
Script Programming Tutorials
Database Programming Tutorials
Mobile Technologies Tutorials
Other Programming Tutorials
Examples
Articles
Tools
News
AngularJS Dropdown ng-change Event Example
Keywords : Angularjs dropdown change event example, Angularjs show hide div based on dropdown list value example, Angularjs dropdown onchange event example, Angularjs dropdown ng-change to get value
Example
<!DOCTYPE html> <html> <head> <title> AngularJs ng-change Event with Select / Dropdownlist Example </title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script type="text/javascript"> var app = angular.module('ngchangeApp', []); app.controller('ngchangeCtrl', function ($scope) { $scope.arrlist = [{ "userid": 1, "name": "Suresh" }, { "userid": 2, "name": "Rohini" }, { "userid": 3, "name": "Praveen" }]; $scope.getdetails = function () { if ($scope.userselected.userid == "2") $scope.result = true; else $scope.result = false; } }); </script> </head> <body> <div ng-app="ngchangeApp" ng-controller="ngchangeCtrl"> <h2>AngularJS ng-change Event with Dropdownlist</h2> <select name="users" ng-options="user.name for user in arrlist" ng-change="getdetails()" ng-model="userselected"> <option value="">--Select User--</option> </select><br /><br /> <div style="padding:10px; border:1px solid black; width:30%; font-weight:bold" ng-show='result'>Hi Welcome to Tutlane.com... Angularjs</div> </div> </body> </html>
Click Here to See Result
Result
Previous
Next