CODEWITHSUNDEEP
jqueryasp.net-mvcasp.net-mvc-3teleriktelerik-mvc
Brendan Vogt
Brendan Vogt

Reputation: 26048

Telerik MVC extensions date picker not putting date in textbox

I am using ASP.NET MVC 3 with razor and the latest version of the Telerik MVC extensions controls.

I have a date picker on my view:

<td><label>From:</label></td>
<td>
     @(Html.Telerik()
          .DatePickerFor(x => x.HospitalisedStartDate)
          .Name("HospitalisedStartDate")
     )
</td>

This property in my view model:

public DateTime? HospitalisedStartDate { get; set; }

When the view loads, I would click on the calendar icon. The calendar pops up, I would select a date and then nothing happens. The calendar disappears but the date is not set the textbox. Why would this be? If I were to type in the word "today" in the textbox then it will put in todays date like "2012/01/21". What am I missing here that is preventing it from working?

The markup looks like this for the style sheets and JavaScript:

<link type="text/css" href="/Content/2011.3.1115/telerik.common.min.css" rel="stylesheet"/>
<link type="text/css" href="/Content/2011.3.1115/telerik.webblue.min.css" rel="stylesheet"/>
<link type="text/css" href="/Content/Stylesheets/mystylesheet.css" rel="stylesheet"/>

<script src="/Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/Scripts/2011.3.1115/telerik.common.min.js"></script>
<script type="text/javascript" src="/Scripts/2011.3.1115/telerik.tabstrip.min.js"></script>
<script type="text/javascript" src="/Scripts/2011.3.1115/telerik.calendar.min.js"></script>
<script type="text/javascript" src="/Scripts/2011.3.1115/telerik.datepicker.min.js"></script>
<script type="text/javascript" src="/Scripts/2011.3.1115/telerik.treeview.min.js"></script>

Upvotes: 1

Views: 3593

Answers (4)

Nirupama M Meesala
Nirupama M Meesala

Reputation: 11

jQuery 1.6.4 works just fine for me. However, I tried jquery-1.5.1.min.js and also tried 1.7.1. and it did not work. The icon was not showing up.

Upvotes: 1

Brendan Vogt
Brendan Vogt

Reputation: 26048

There seems to be an issue with the date picker when using jQuery 1.7 and higher. I changed it to jQuery 1.6.4 and it works now. Does any body know why this is the case?

This is now in my view:

<script src="/Scripts/jquery-1.6.4.min.js"></script>

Upvotes: 2

Jason Satterfield
Jason Satterfield

Reputation: 147

Have you updated jQuery?

After thinking carefully about what I might have changed, I remembered that I needed to test a newer version of jQuery. I had replaced the file jquery-1.6.4.min.js with jquery-1.7.1.js about a week ago. Restoring the 1.6.4 version has fixed my problem. My page worked exactly the way it was designed to work.

Upvotes: 1

Jason Satterfield
Jason Satterfield

Reputation: 147

I'm having this same problem. I'm using MVC3 (non-Razor), Telerik MVC Controls, and jQuery. I've only recently started seeing this problem. Unfortunately, I can't seem to isolate what I might have changed to spark this behavior. I've recently had to add an ASP.NET Script Manager to import script resources from a 3rd party assembly, as well as some custom code to assist with generating redundant markup.

In response to Nick's question, the Telerik controls automagically insert a

<%: Html.Telerik().ScriptRegistrar() ... %>

line into the markup, but that's been there since the beginning of my project - when the DatePicker worked as expected.

I am seeing this behavior in both Firefox and IE. In sheer desperation, I stripped my file down to exactly this:

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!DOCTYPE html>
<html>
  <head runat="server">
    <title>Test</title>
    <%: Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.Add("telerik.common.css").Add("telerik.webblue.css").Combined(true).Compress(true)) %>
  </head>
  <body>
    <form id="frmMain" method="post" runat="server">
      <% Html.Telerik( ).DatePicker( )
            .Name( "dtTest" )
            .HtmlAttributes( new { id = "dtTest_wrapper" } )
            .Min( DateTime.Today.Subtract( new TimeSpan( 3835, 0, 0, 0, 0 ) ) )
            .Max( DateTime.Today.Add( new TimeSpan( 24, 0, 0 ) ) )
            .ShowButton( true )
            .OpenOnFocus( true )
            .Render( ); %>
    </form>
    <%: Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(false).Compress(false)) %>
  </body>
</html>

This still isn't working the way it should. This is a master page (always has been), but there's nothing defined in any of the child pages, yet (never has been).

Upvotes: 0

Related Questions