Questions tagged [bootstrap-datepicker]

bootstrap-datepicker is a datepicker widget by uxsolutions (eternicode) that uses Twitter's bootstrap library. (Forked from eyecon)

bootstrap-datepicker is a datepicker widget that uses Twitter's bootstrap library. It provides a calendar popup for selecting dates when users click on input elements.

There are two main versions of the library in use:

  1. The original by Stefan 'eyecon' Petre
  2. Eternicode's fork of the library, which is under more active development and has both a larger feature set and much more comprehensive documentation.

Further Reading:

Stack Snippet Starter Pack:

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.1/css/bootstrap-datepicker3.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.1/js/bootstrap-datepicker.js"></script>

<script>
    $(document).ready(function(){
        $('#datepicker').datepicker();
    });
</script>

<input type="text" class="datepicker" id="datepicker" />
1112 questions
82
votes
8 answers

Detect change to selected date with bootstrap-datepicker

I have an input element with an attached datepicker created using bootstrap-datepicker.
76
votes
13 answers

bootstrap datepicker today as default

I am using this bootstrap-datepicker for my datepicker. I'd like the datepicker to choose "today" for start day or default day. I cannot figure out how to set "today" automatically, so I did an inefficient way HTML:
olo
  • 5,225
  • 15
  • 52
  • 92
59
votes
2 answers

How do I get bootstrap-datepicker to work with Bootstrap 3?

I use the version of bootstrap-datepicker maintained by eternicode (Andrew Rowls). On Bootstrap 2 it worked, but now it doesn't work with the Bootstrap 3 library. How can I get bootstrap-datepicker to work with Bootstrap 3? Note: The repository…
54
votes
10 answers

Twitter Bootstrap date picker

How can I use the Twitter Bootstrap date picker? I used the code below but its not working. DatePicker Demo
Sangram Anand
  • 10,526
  • 23
  • 70
  • 103
46
votes
7 answers

How to restrict the selectable date ranges in Bootstrap Datepicker?

I need to use datepicker which provides me the option of restricting the selectable dates. We had been using jQuery UI which is used to support it using minDate, maxDate options. $("#id_date").datepicker({minDate: +1, maxDate: '+1M +10D'});…
43
votes
5 answers

Bootstrap DatePicker, how to set the start date for tomorrow?

How can I set the startDate for tomorrow? I don't see an option in the documentation for Date.today so I can add one more day. Is there a way to accomplish this? $(function() { $("#appointment_adate").datepicker({ format: 'yyyy-mm-d', …
evanx
  • 1,291
  • 4
  • 17
  • 33
41
votes
20 answers

Bootstrap datepicker disabling past dates without current date

I wanted to disable all past date before current date, not with current date. I am trying by bootstrap datepicker library "bootstrap-datepicker" and using following code: $('#date').datepicker({ startDate: new Date() }); It works fine. But it…
itskawsar
  • 1,232
  • 1
  • 19
  • 30
38
votes
14 answers

bootstrap datepicker setDate format dd/mm/yyyy

I have to set the date in my datepicker in dd/mm/yyyy format. Whet I'm trying to do, with Javascript is this: var year = 2014; var month = 5; var day = 10; var realDate = new Date(year, month - 1, day); // months are 0-based! …
Martina
  • 1,852
  • 8
  • 41
  • 78
29
votes
5 answers

Sort a string date array

I want to sort an array in ascending order. The dates are in string format ["09/06/2015", "25/06/2015", "22/06/2015", "25/07/2015", "18/05/2015"] Even need a function to check whether these dates are in continuous form: eg - Valid -…
Suyog Sawant
  • 440
  • 1
  • 4
  • 12
29
votes
1 answer

Bootstrap datepicker orientation/placement

I have a text field with an attached datepicker placed at the bottom of the page. My problem is that the datepicker appears below the text field. Consequently, it appears outside the window. I Googled and found that apparently I can fix this with…
ABC
  • 4,263
  • 10
  • 45
  • 72
28
votes
6 answers

Sticky issue on bootstrap datepicker

I am using bootstrap datepicker on a website, It is also styled to be sticky by giving its parent a fixed position, Its working fine normally but on testing it on Ipad and Iphone (not tested on andriod devices yet), when I scroll down and try to…
UmeRonaldo
  • 619
  • 2
  • 7
  • 19
26
votes
2 answers

Bootstrap datepicker change minDate/startDate from another datepicker

There are two datepickers in my page and both are of bootstrap. The condition is only that Start date never High with respect to End Date. Means End date Attribute (minDate) must be changed when Start Date changed by datepicker and same when End…
26
votes
11 answers

bootstrap datepicker change date event doesnt fire up when manually editing dates or clearing date