Jquery Question posted in
The official Jquery Api Documentation can be found here.

Jquery – How to remove current date highlight and restrict future and current date from selecting?

I am trying to remove current date highlight and restrict future and current date from selecting, I tried this below code

$(".datepick").datepicker("destroy");
$(".datepick").datepicker({
    dateFormat: 'dd/mm/yy',
    showOtherMonths: true,
    selectOtherMonths: true,
    maxDate: 0,
});

This above one is restricting future dates but not current date.

$(".ui-datepicker-today a").removeClass("ui-state-default ui-state-highlight ui-state-active");

tried this too to remove the current date highlight but it is not removing.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 
     $(".datepick").datepicker("destroy");
                $(".datepick").datepicker({
                    dateFormat: 'dd/mm/yy',
                    showOtherMonths: true,
                    selectOtherMonths: true,
                    //minDate: new Date(),
                    maxDate: 0,
                    beforeShowDay: function (date) {
                       
                        var currentDate = new Date();

                       
                        if (date.getFullYear() === currentDate.getFullYear() && date.getMonth() === currentDate.getMonth() && date.getDate() === currentDate.getDate())
                        {
                          return false;
                        }
                        return true;
                    
                    }
                    
                });

  2. 0

    You’re very close. According to the documentation a value of -1 will set the maximum date to yesterday:

    $(function() {
  $("#datepicker").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    maxDate: -1
  });
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">

<p>Date: <input type="text" id="datepicker"></p>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search