How to set min/max values in angularjs Datepicker


Angularjs Datepicker: How to set min/max date in angularjs-datepicker.

This is an example to show how can we set minimum and maximum date in a angularjs-datepicker component so that user can select dates within the range. Other dates which do not lie in the range are not selectable.

Example code:

1.  Write code to develop search admission form:

<div class="module directive">
 <form role="form">
  <div class="form-group">
    <label>Admission Date:</label> 
      <datepicker date-format="MM/dd/yyyy"  date-min-limit="{{admissionDateMinLimit}}" date-max-limit="{{admissionDateMaxLimit}}" selector="form-control"> 
        <div class="input-group" >
          <input  type="text"  ng-model="admissionDate" class="form-control" placeholder="Select Admission Date"/>
            <span class="input-group-addon" style="cursor: pointer">
              <i class="fa fa-lg fa-calendar"></i>
      <button type="submit" ng-click="student.findAdmissions();" class="btn btn-default">Search</button>

2.  Write a angularjs directive that will popup search addmission form.
3.  Write code to set min/max date

    .directive('student', function AdmissionSearchDrctv () {
        return {
            restrict: 'EA',
            replace: true,
            scope: true,
            templateUrl: "",
            controllerAs: 'student',
            controller: function ( $scope) {
   var currentDate = new Date();
         $scope.admissionDateMaxLimit = currentDate.getMonth() + 1  + '/' + currentDate.getDate() + '/' + currentDate.getFullYear();
         $scope.admissionDateMinLimit = currentDate.getMonth() + '/' + currentDate.getDate() + '/' + currentDate.getFullYear();
            this.findAdmissions = function () { 
Posted in Angularjs.


  1. It’s the best time to make a few plans for the long run and it’s time to be happy.
    I have read this submit and if I could I wish to counsel you
    few attention-grabbing things or suggestions. Perhaps you could write subsequent articles relating to
    this article. I desire to learn more issues about it!

  2. Hey, I think your website might be having browser compatibility
    issues. When I look at your blog site in Chrome, it looks fine but when opening in Internet Explorer, it
    has some overlapping. I just wanted to give you a quick heads up!

    Other then that, great blog!

  3. I like the helpful information you provide in your articles.
    I’ll bookmark your weblog and check again here regularly.

    I am quite certain I’ll learn a lot of new stuff right here!
    Good luck for the next!

  4. I used to be suggested this blog by means of my cousin. I’m no longer positive whether or
    not this put up is written by means of him as no one else understand such specific approximately my difficulty.
    You are amazing! Thank you!

Comments are closed.