Bootstrap date time picker validate

Question

I am using bootstrap DateTime control, I am not able to validate date that is
"Max date is today"

HTML Code

<div class="col-md-3">
   <div id="datepicker-popup" class="input-group date datepicker">                            
      @Html.TextBoxFor(model => model.FromDate, new { @class = "form-control" , @placeholder = "dd/MM/yyyy", @autocomplete = "off", @readonly = "readonly" })
      <span class="input-group-addon input-group-append border-left">
        <span class="mdi mdi-calendar input-group-text"></span>
      </span>
   </div>
</div>

Jquery Code

$('#FromDate').datepicker({
      format: 'mm-dd-yyyy',
      autoclose: true,           
      maxDate: new Date()
 });

I am not able to find where I am doing something wrong, please let me know any solution if it is possible.

Thank you

try `endDate: '0d'` instead of `maxDate: new Date()`. there is not such option as maxdate. — User863, Mar 20 '19 at 06:13
Did you looking for this: https://stackoverflow.com/questions/7934252/jquery-datepicker-with-today-as-maxdate? Which datepicker you're using? — Tetsuya Yamamoto, Mar 20 '19 at 06:15
I am not able to understand that what is going to be wrong why that solution not working in my app — shivani, Mar 20 '19 at 06:16
How about using `endDate: new Date()`? Probably you should look for this: https://stackoverflow.com/questions/44391206/mindate-and-maxdate-options-are-not-working-in-datepicker. — Tetsuya Yamamoto, Mar 20 '19 at 06:18
should refer this link https://stackoverflow.com/questions/39022610/bootstrap-datetimepicker-set-maxdate-relative-to-now/39223334 — Hien Nguyen, Mar 20 '19 at 06:21

score 2 · Accepted Answer · answered Mar 20 '19 at 07:21

May be there are many different versions of bootstrap datepicker.

I tried a sample that use datetimepicker instead of datepicker.

$('#FromDate').datetimepicker({
      format: 'mm-dd-yyyy',        
      maxDate: 'now'
 });

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" />

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>   
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<div class="col-md-3">
                    <div id="datepicker-popup" class="input-group date datepicker">                            
                       <input type="text" class="form-control" id="FromDate" />
                        <span class="input-group-addon input-group-append border-left">
                            <span class="mdi mdi-calendar input-group-text"></span>
                        </span>
                    </div>
                </div>

Bootstrap date time picker validate

1 Answers1