Bootstrap Datepicker is not Working .Using BootStrap 3.3.1

Question

First I have downloaded the zip file from bellow link http://www.eyecon.ro/bootstrap-datepicker/ and i got the following structure 1.CSS folder - datepicker.css 2.JS folder-bootstrap-datepicker.js 3.less folder - datepicker.less

then i have added it to my asp.net mvc 4 project structure and in the index.cshtml i have added the references then bellow is my code

<script src="http://code.jquery.com/jquery.js"></script>
    <script src="~/Contents/bootstrap/js/bootstrap.min.js"></script>
    <script src="~/Contents/bootstrap/js/npm.js"></script>
    <script src="~/Contents/bootstrap/js/bootstrap-datepicker.js"></script>
<script type="text/javascript">
        $(function () {
            $('#datetimepicker9').datepicker();
            $('#datetimepicker10').datepicker();
            $("#datetimepicker9").onclick ("dp.change", function (e) {
                $('#datetimepicker10').data("DateTimePicker").setDate(e.date);
            });
            $("#datetimepicker10").onclick("dp.change", function (e) {
               $('#datetimepicker9').data("DateTimePicker").setDate(e.date);
            });
        });
    </script>


<div class="searchDatePickerRow">
            <div class="searchFrmDate">
                <form class="formMargin" role="form">
                    <div class="form-group">
                <div class="input-group date" id="datetimepicker9">
                    <input type="text" class="form-control" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
                </form>
            </div>
            <div class="searchToDate">
                <form class="formMargin" role="form">
                    <div class="form-group">
                <div class="input-group date " id="datetimepicker10">
                    <input type="text" class="form-control" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
                </form>
            </div>
        </div>

but when i click on the calander image datepicker is not working. I have followd the bellow links How do I get bootstrap-datepicker to work with Bootstrap 3? Bootstrap-Datetimepicker Not working but not getting any success.In the above link it is mentioned to add datetimepicker.js and moment.js but from where i will get this file.

On the page, try this code in console and check what error it gives. `$('#datetimepicker9').datepicker();` — anpsmn, Nov 27 '14 at 07:52
I have updated the above comment TypeError- Date is undefind — Debashrita, Nov 27 '14 at 09:26
[Check this](http://stackoverflow.com/questions/21675206/typeerror-date-is-undefined-in-bootstrap-datepicker) — anpsmn, Nov 27 '14 at 09:33
I am using bootstrap 3.3.1 and i have downloaded datepicker from the bellow link http://vitalets.github.io/bootstrap-datepicker/ — Debashrita, Nov 27 '14 at 09:39
The link also has markup for BS 2 than BS 3.3. You need to get the version compatible with BS 3. — anpsmn, Nov 27 '14 at 09:55
[Use this](http://eternicode.github.io/bootstrap-datepicker/) as mentioned [here](http://stackoverflow.com/a/19275903/473016). — anpsmn, Nov 27 '14 at 09:58

score 1 · Answer 1 · answered Dec 04 '14 at 04:39

1

You didn't add bootstrap-datepicker.css Add the datepicker.css after bootstrap.css. You can get it from this url http://www.eyecon.ro/bootstrap-datepicker/

then call this javascript below:

$('.datepicker').datepicker();

answered Dec 04 '14 at 04:39

Sarower Jahan

1,445
1
13
20

score 0 · Answer 2 · answered Nov 27 '14 at 07:28

0

you have missed the class datepicker or the data attributes in your input class. you have to add this in your input tag.

<input class="datepicker" data-provide="datepicker">

answered Nov 27 '14 at 07:28

Ahmad Sharif

4,141
5
37
49

Added the above class and as well as data-provider but it is not working – Debashrita Nov 27 '14 at 07:34

Bootstrap Datepicker is not Working .Using BootStrap 3.3.1

2 Answers2