There are two things that need to be changed in your code:
in your script.js
var months = $.map($(Array('jan','feb' , 'mar' ,'apr' ,'may','june','jul','Aug','Sept','Oct','Nov','Dec')), function (val, i) { return val; });
Prior to this change, you were using 12 arrays and simply returning the index.
Additionally, add
<option value="">-- choose State --</option></select>
inside the Select tag.
// Custom code snippet
(function () {
var myApp = angular.module('MyApp', []);
myApp.controller('BirthdayController', ['$scope', function ($scope) {
var numberOfYears = (new Date()).getYear() - 10;
var years = $.map($(Array(numberOfYears)), function (val, i) { return i + 1900; });
var months = $.map($(Array('jan','feb' , 'mar' ,'apr' ,'may','june','jul','Aug','Sept','Oct','Nov','Dec')), function (val, i) { return val; });
var days = $.map($(Array(31)), function (val, i) { return i + 1; });
var isLeapYear = function () {
var year = $scope.SelectedYear || 0;
return ((year % 400 === 0 || year % 100 !== 0) && (year % 4 === 0)) ? 1 : 0;
}
var getNumberOfDaysInMonth = function () {
var selectedMonth = $scope.SelectedMonth || 0;
return 31 - ((selectedMonth === 2) ? (3 - isLeapYear()) : ((selectedMonth - 1) % 7 % 2));
}
$scope.UpdateNumberOfDays = function () {
$scope.NumberOfDays = getNumberOfDaysInMonth();
}
$scope.NumberOfDays = 31;
$scope.Years = years;
$scope.Days = days;
$scope.Months = months;
}]);
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@*" data-semver="1.4.0-beta.5" src="https://code.angularjs.org/1.4.0-beta.5/angular.js"></script>
<script data-require="jquery@*" data-semver="2.1.3" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="MyApp">
<div class="ng-scope" ng-controller="BirthdayController">
<h1>Birthday Validator</h1>
<div>
Year : <select ng-model="SelectedYear" ng-options="label for label in Years" ng-change="UpdateNumberOfDays()">
<option value="">-- choose Year --</option>
</select>
</div>
<div>
Month: <select ng-model="SelectedMonth" ng-options="label for label in Months" ng-change="UpdateNumberOfDays()">
<option value="">-- choose Month --</option></select>
</div>
<div>
Day: <select ng-model="SelectedDay" ng-options="label for label in Days | limitTo:NumberOfDays">
<option value="">-- choose Day --</option></select>
</div>
</div>
</body>
</html>