The full code is this .
<!DOCTYPE html>
<html ng-app>
<head>
<meta charset="utf-8" />
<title>Code Refactor</title>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js";></script>
<script
src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.11.2/ui-bootstrap-tpls.js";></script>
<script>
angular.module('modalTest',['$scope','$modal'])
.controller('dialogServiceTest',function($scope,$modal){
$scope.open = function (refactor) {
var modalInstance = $modal.open({
templateUrl: 'refactor.html',
resolve: {
refactor: function () {
return 'Refactor';
}
}
});
};
}); // end run / module
</script>
<script type="text/ng-template" id="refactor.html">
<div class="modal-header">
<h3 class="modal-title">Modal!</h3>
</div>
<div class="modal-body">
<div >Body</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary"
ng-click="$close('awesome')">OK</button>
<button class="btn btn-warning"
ng-click="$dismiss('nah')">Cancel</button>
</div>
</script>
<!--[if IE]>
<script
src="http://html5shiv.googlecode.com/svn/trunk/html5.js";></script>
<![endif]-->
</head>
<body ng-controller="dialogServiceTest">
<header>
<input type="text" name="refactor" ng-model="refactor"
class="form-control" required>
<h1>Code Refactor {{ refactor }}</h1>
<div ng-show="submitted && form.$invalid" class="alert
alert-danger">
<div ng-show="form.refactor.$error.required">
Refactoring is Required
<script>alert('Refactoring is Required');</script>
</div>
</div>
<button
type="submit"
class="btn btn-primary btn-large"
ng-click="submitted=true">
Submit
</button>
<a data-ng-click="open(refactor)" href=""><span
class="glyphicon glyphicon-open"></span>View</a>
</header>
<section>
</section>
<footer>
</footer>
</body>
</html>
Thanks.
On Tuesday, 6 January 2015 18:18:02 UTC+5:30, Mohan Radhakrishnan wrote:
>
> Hi,
> Can I open a Angular UI bootstrap modal window from the view
> like this ? I am trying to simplify the form validation by not calling
> acontroller.
>
> <script src="
> http://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.11.2/ui-bootstrap-tpls.js
> "></script>
> <script>
> $scope.open = function (refactor) {
>
> var modalInstance = $modal.open({
> templateUrl: 'refactor.html',
> resolve: {
> items: function () {
> return $scope.items;
> }
> }
> });
>
> };
> </script>
> <script type="text/ng-template" id="refactor.html">
> <div class="modal-header">
> <h3 class="modal-title">Modal!</h3>
> </div>
> <div class="modal-body">
> <div >Body</div>
> </div>
> <div class="modal-footer">
> <button class="btn btn-primary"
> ng-click="$close('awesome')">OK</button>
> <button class="btn btn-warning"
> ng-click="$dismiss('nah')">Cancel</button>
> </div>
> </script>
>
>
>
> Thanks,
> Mohan
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
