<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>how to Capitalize input character in textbox angularjs?</title>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.1/angular.min.js"></script>
  <script>
    var app = angular.module("capitalizeApp", []);
    app.controller('capitalizeController', function($scope) {
      $scope.name = 'Anil Singh';
    });

    app.directive('capitalizeInputText', function() {
      return {
        require: 'ngModel',
        link: function(scope, element, attrs, capitalizeModelCtrl) {

          var capitalizeInputText = function(inputText) {
            var capitalizedValue = inputText.toUpperCase();

            if (inputText === undefined) {
              inputText = "";
            } else {
              if (capitalizedValue !== inputText) {
                capitalizeModelCtrl.$setViewValue(capitalizedValue);
                capitalizeModelCtrl.$render();
              }
            }
            return capitalizedValue;
          }

          capitalizeModelCtrl.$parsers.push(capitalizeInputText);
          capitalizeInputText(scope[attrs.ngModel]); //This is used to capitalize the initial value.
        }
      };
    });
  </script>
</head>

<body ng-app="capitalizeApp">
  <div>
    <a href="http://www.code-sample.com/2015/02/angularjs-auto-capitalize-input.html">Auto capitalize input character in textbox?</a>
  </div>
  <div ng-controller="capitalizeController">
    Input TextBox:
    <input type="text" ng-model="name" capitalize-Input-Text>
  </div>

  <div>
    <br/>
    <a href="http://www.code-sample.com/2015/02/angularjs-auto-capitalize-input.html" target="_blank"></a>
  </div>
</body>

</html>
// Code goes here

/* Styles go here */