How Do I Add Datepicker Using Bootstrapdatepicker In Mvc Application?

Question

How do i add datepicker using bootstrapdatepicker in MVC application?

Am creating one application using .net MVC. I want to add datepicker. I downloaded bootstrapdatepicker using nu-get package. Could anyone please explain how to use it? I tried below but it doesn't work.

Addded js and css files

datepicker3.css
bootstrap-datepicker.js

Then i added one input box in my page Hide Copy Code

<input type="text" id="gd" type="text" class="form-control">

added below code as well Hide Copy Code

$(document).ready(function () {
  $("#gd").datepicker({
    calendarWeeks: true
  });
});

Please suggest if you have any other way to do this or explain me how to do this using nuget package? But nothing is coming when I click on input box . But am expecting datepicker to populate. What is the issue here?

Are you including the bootstrap? Is the code in <script> tags? — JNF
– JNF, Commented Apr 1, 2015 at 7:36

Samuel M kabiena · Accepted Answer · 2015-07-29 13:27:46Z

1

look for the tool button in toolbar, select nuget package manager , select package Manager Console, type in package Manager console "Install-Package datepicker

answered Jul 29, 2015 at 13:27

Samuel M kabiena

318 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Prashant G · Accepted Answer · 2015-04-01 07:48:11Z

0

You need to have

jQuery 1.7.1+
Bootstrap 2.0.4+
datepicker.js
datepicker.css

for making Datepicker to work. The reason it is not working for you might be because you installed the datepicker from NuGet package, but the downloaded files are not included in the files in which you want datepicker. Please make sure all the files below are included in the order they are. It should work.

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"></script>
<script src="~/Scripts/bootstrap-datepicker.min.js"></script>
<link href="~/Content/bootstrap-datepicker.min.css" rel="stylesheet" />

Here's the code that worked for me. enter image description here

answered Apr 1, 2015 at 7:48

Prashant G

4,9303 gold badges38 silver badges47 bronze badges

Collectives™ on Stack Overflow

How Do I Add Datepicker Using Bootstrapdatepicker In Mvc Application?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related