Don't like ads? PRO users don't see any ads ;-)
Guest

Using the jquery datepicker in ASP.Net MVC3 projects

By: a guest on Apr 2nd, 2012  |  syntax: None  |  size: 2.48 KB  |  hits: 36  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. [DisplayName("Available from")]
  2.     [DisplayFormat(DataFormatString="{0:d}",ApplyFormatInEditMode=true,NullDisplayText="(not specified")]
  3.     public DateTime? From { get; set; }
  4.        
  5. <div class="editor-field">
  6.         @Html.EditorFor(model => model.Standin.From)
  7.         @Html.ValidationMessageFor(model => model.Standin.From)
  8.     </div>
  9.        
  10. <head>
  11. <title>@ViewBag.Title</title>
  12. <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
  13. <link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
  14. <script src="@Url.Content("~/Scripts/jquery-1.5.1.js")" type="text/javascript"></script>
  15. <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
  16. <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
  17. </head>
  18.        
  19. @model Nullable<System.DateTime>
  20.  
  21. @if (Model.HasValue)
  22. {
  23.     @Html.TextBox("", Model.Value.ToShortDateString(), new { @class = "date" })
  24. }
  25. else
  26. {
  27.     @Html.TextBox("",string.Empty)
  28. }
  29. <script type="text/javascript">
  30.     $(document).ready(function () { $('.date').datepicker({ dateFormat: "dd/mm/yy" }); });
  31. </script>
  32.        
  33. <script src="@Url.Content("~/Scripts/jquery-1.4.4.js")" type="text/javascript"></script>
  34. <script src="@Url.Content("~/Scripts/jquery-ui-1.8.14.min.js")" type="text/javascript"></script>
  35.        
  36. <link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
  37.        
  38. <link rel="stylesheet" href="../../../JQueryScripts/themes/base/jquery.ui.all.css"/>
  39. <script type="text/javascript" src="@Url.Content("~/JQueryScripts/jquery-1.6.2.js")"></script>
  40. <script type="text/javascript" src="@Url.Content("~/JQueryScripts/ui/jquery.ui.core.js")"></script>
  41. <script type="text/javascript" src="@Url.Content("~/JQueryScripts/ui/jquery.ui.widget.js")"></script>
  42. <script type="text/javascript" src="@Url.Content("~/JQueryScripts/ui/jquery.ui.datepicker.js")"></script>
  43. <script type="text/javascript" src="@Url.Content("~/JQueryScripts/ui/i18n/jquery.ui.datepicker-nl.js")"></script>
  44.  
  45.     <script type="text/javascript">
  46.         $(document).ready(function () {
  47.             $('.datepicker').datepicker({
  48.                 dateFormat: "dd-mm-yy",
  49.                 minDate:0
  50.             });
  51.           });
  52.     </script>
  53.  
  54.  
  55. @model Nullable<System.DateTime>
  56.  
  57. @if (Model.HasValue)
  58. {
  59.     @Html.TextBox("", Model.Value.ToShortDateString(), new { @class = "datepicker" })
  60. }
  61. else
  62. {
  63.     @Html.TextBox("", string.Empty, new { @class = "datepicker" })
  64. }