1

日付ピッカーのテキスト ボックスの作成方法を学べるチュートリアルや書籍を教えてください。

ありがとうございました。

PS 実際には、上記の日付 (開始日と終了日) を選択するときに、2 つのテキスト ボックスと予約を行う 1 つのボタンが必要です。

4

3 に答える 3

3

ここでいくつかの優れたチュートリアルを入手できます。jQuery UI DatePickerの簡単な実装:

Javascript :

$(document).ready(function () {
   $('.txtStartDate, .txtEndDate').datepicker({
       showOn: "both",
       dateFormat: 'dd/mm/yy',
       showAnim: "slideDown",
       showOptions: {
         origin: ["top", "left"]
       },
       firstDay: 1, 
       changeFirstDay: false
   });
});

マークアップ:

@model DateTime
@Html.TextBox("", Model.ToString("dd/MM/yyyy"), new { @class = "txtStartDate" })
@Html.TextBox("", Model.ToString("dd/MM/yyyy"), new { @class = "txtEndDate" })
于 2012-11-02T10:11:37.620 に答える
2

もう 1 つのオプション (chridam のものと同様) は、日付ピッカーを必要とするすべてのテキスト ボックスに使用できる 1 つのクラスを定義することです (オプションが同じであると仮定します)。

かみそり：

@model DateTime
@Html.TextBox("", Model.ToString("dd/MM/yyyy"), new { @class = "date-picker" })
@Html.TextBox("", Model.ToString("dd/MM/yyyy"), new { @class = "date-picker" })

Javascript:

$(document).ready(function () {
   $('.date-picker').datepicker({
      //options...
   });
});
于 2012-11-02T17:06:44.730 に答える
1

Asp.Net

<form id="form1" runat="server">
  <asp:TextBox ID="fromDate" runat="server" />
  <asp:TextBox ID="toDate" runat="server" />
 </form>

Jクエリ

var dates = $("#fromDate, #toDate").datepicker({
                maxDate: '0',
                changeMonth: true,
                numberOfMonths: 1,
                onSelect: function () { //write your code on selection}
            });
于 2012-11-02T10:18:40.887 に答える