Question

在我的MVC4剃须刀引擎中，我需要从文本框中选择日期我的观点

<tr>
  <td>Start Date</td>
  <td>@Html.TextBox("RateListStartDate")</td>
</tr>

<tr>
  <td>End Date</td>
  <td>@Html.TextBox("RateListEndDate")</td>
</tr>

当我点击开始日期或结束日期的文本框时，它应显示日历，任何链接/代码/建议？

Answer 1

由于您使用MVC，jQuery“应该”已在您的布局页面中引用。您还需要jqueryUI。

如果datepicker代码向您投掷错误，请将以下两行添加到您的视图或布局页面中：

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

然后你需要声明元素，它们应该获得datepicker功能。

$(document).ready(function(){
    $(".getdate").each(function() {
        $(this).datepicker();
    });
});

并相应地编辑你的Html.TextBoxFor（）：

@Html.TextBox("RateListStartDate", new {@class="getdate"})

这应该可以解决问题。亲切的问候

Answer 2

您可以使用jquery datepicker。 DATEPICKER DEMO

$(document).ready(function(){
    $(".datepicker").each(function() {
        $(this).datepicker();
    });
});

jsfiddle

Answer 3

<!doctype html>
  <head>
  <meta charset="utf-8" />
  <title>jQuery UI Datepicker - Restrict date range</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script>
    $(function() {
      $( "#datepicker" ).datepicker({ minDate: -100, maxDate: "+0D" });
      $("#datepicker").datepicker("setDate",new Date());
      $( "#datepicker" ).datepicker( "option", "dateFormat", "dd/mm/yy");
    });
</script>
</head>
<body>
  <p>Date: <input type="text" id="datepicker" /></p>
</body>
</html>

Answer 4

$(document).ready(function () {
        $('#txtBoxId').datepicker();
    });

将此参考您的布局

@Scripts.Render("~/bundles/jqueryui")

Answer 5

git checkout

单击文本框时如何添加DatePicker？

5 个答案: