user897237
user897237

Reputation: 623

Datepicker - no reaction

I'm trying to add datapicker to my project. I have followed a tutorial.

I have added the following code to the DatePickerReady.js file:

$(function () {
    $(".datefield").datepicker(); 
});

I have added the following code at bottom of the head element in the Views\Shared_Layout.cshtml file.

<link href="@Url.Content("~/Content/themes/base/jquery.ui.core.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.datepicker.css")" rel="stylesheet"  type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.theme.css")" rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Scripts/jquery.ui.core.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.ui.datepicker.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/DatePickerReady.js")" type="text/javascript"></script>

I have added this to Views\Home\Index.cshtml

@model Nullable<DateTime>

 @{
    string dts ="";
    if (Model != null)
    {
        dts = ((DateTime)Model).ToShortDateString();

    }
    @Html.TextBox("start", String.Format("{0:d}", dts), new { @class = "datefield", type = "date"  })
} 

But when I focus/click the textbox it does nothing. The calendar doesn't appear. I'm not getting any errors as well.

Any clue?

Upvotes: 0

Views: 491

Answers (1)

Yasser Shaikh
Yasser Shaikh

Reputation: 47794

Firstly make sure you have included all your scripts, from the scripts you have posted I did not see jquery.js, also make sure that these scripts are indeed available i.e check thier paths.

Use firebug and find out if you are getting any console errors when you click on the dateTime textbox.

Next check if the class is being attached to html textbox input and the jquery call is also made, verify these.

Here is a simple step by step guide to using Datepicker in ASP.NET MVC 3 : Introduction to jquery Date Picker in ASP.NET MVC

and I am very curious to know what does DatePickerReady.js do ?

Upvotes: 1

Related Questions