<!DOCTYPE html> <html ng-app> <head> <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css" /> <link rel="stylesheet" type="text/css" href="assets/css/todc-bootstrap.css" /> <link rel="stylesheet" type="text/css" href="assets/css/todc-datepicker.css" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="assets/js/bootstrap-datepicker.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script src="assets/js/angular.js"></script> <style type="text/css"> html,body { margin: 20px; } </style> </head> <body> <form class="form-horizontal" ng-controller="MyController"> <div class="control-group"> <label class="control-label" for="dt1">Select Date</label> <div class="controls"> <div class="input-append"> <input class="span2" id="dt1" type="text" ng-model="selectedDate" /> <button class="btn" type="button" id="cal1"></button> </div> <input class="btn" type="button" value="submit" ng-click="add()"> </div> <h6 class="control-label"> selected date : </h6> </div> </form> </body> <script type="text/javascript"> $(function() { $('#cal1').datepicker({ autoclose: true, todayHighlight: true, targetInput: $("#dt1") }); }); function MyController($scope) { $scope.add = function() { alert($scope.selectedDate); } } </script> </html>
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)