{"action":"closed","issue":{"url":"https://api.github.com/repos/angular-ui/bootstrap/issues/4447","labels_url":"https://api.github.com/repos/angular-ui/bootstrap/issues/4447/labels{/name}","comments_url":"https://api.github.com/repos/angular-ui/bootstrap/issues/4447/comments","events_url":"https://api.github.com/repos/angular-ui/bootstrap/issues/4447/events","html_url":"https://github.com/angular-ui/bootstrap/issues/4447","id":107678539,"number":4447,"title":"ui.bootstrap.modal gives ng-model undefined on HTML5 validation","user":{"login":"rajputvai","id":2168116,"avatar_url":"https://avatars.githubusercontent.com/u/2168116?v=3","gravatar_id":"","url":"https://api.github.com/users/rajputvai","html_url":"https://github.com/rajputvai","followers_url":"https://api.github.com/users/rajputvai/followers","following_url":"https://api.github.com/users/rajputvai/following{/other_user}","gists_url":"https://api.github.com/users/rajputvai/gists{/gist_id}","starred_url":"https://api.github.com/users/rajputvai/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rajputvai/subscriptions","organizations_url":"https://api.github.com/users/rajputvai/orgs","repos_url":"https://api.github.com/users/rajputvai/repos","events_url":"https://api.github.com/users/rajputvai/events{/privacy}","received_events_url":"https://api.github.com/users/rajputvai/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-09-22T09:44:05Z","updated_at":"2015-09-22T09:55:21Z","closed_at":"2015-09-22T09:55:21Z","body":"**Plunker**\r\nhttp://plnkr.co/edit/Jt4VTCMNL2UBsGGnvfeb?p=preview\r\n\r\nPlease follow below steps to produce this error.\r\n1. Click on 'Open Me!' button. (This will open modal.)\r\n2. Click on 'Ok' button. (this will alert '$scope.data.name is : ')\r\n3. Follow Step 1. and give some input to input text box\r\n4. Click on 'Ok' button. (this will alert '$scope.data.name is : <inputed_string>')\r\n5. Follow Step 1. and give some input to input text box, and remove the string from input text box. empty input text box.\r\n6. Click on 'Ok' button. (this will alert '$scope.data.name is : undefined') (instead of giving empty string)\r\n\r\n**Modal html**\r\n```HTML\r\n<script type=\"text/ng-template\" id=\"myModalContent.html\">\r\n    <div class=\"modal-header\">\r\n        <h3 class=\"modal-title\">I'm a modal!</h3>\r\n    </div>\r\n    <div class=\"modal-body\">\r\n      <input type=\"text\" ng-model=\"data.name\" required maxlength=\"6\" minlength=\"6\">\r\n    </div>\r\n    <div class=\"modal-footer\">\r\n        <button class=\"btn btn-primary\" type=\"button\" ng-click=\"ok()\">OK</button>\r\n        <button class=\"btn btn-warning\" type=\"button\" ng-click=\"cancel()\">Cancel</button>\r\n    </div>\r\n</script>\r\n``` \r\nng-model with input type as text and html5 validation.\r\n\r\n**Demo controller**\r\n```Javascript\r\nangular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);\r\nangular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($scope, $modal, $log) {\r\n  $scope.open = function () {\r\n    var modalInstance = $modal.open({\r\n      templateUrl: 'myModalContent.html',\r\n      controller: 'ModalInstanceCtrl',\r\n    });\r\n  };\r\n\r\n});\r\n```\r\nHope nothing to explain.\r\n\r\n**ui.bootstrap.modal controller**\r\n```Javascript\r\nangular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $modalInstance) {\r\n\r\n  $scope.data = { \"name\" : \"\" };\r\n\r\n  $scope.ok = function () {\r\n    alert(\"$scope.data.name is : \"+ $scope.data.name);\r\n    $modalInstance.close();\r\n  };\r\n\r\n  $scope.cancel = function () {\r\n    $modalInstance.dismiss('cancel');\r\n  };\r\n});\r\n```\r\ndefine $scope.data.name as blank string. "}}