1

私は mvc3 が初めてで、ビュー エンジンはカミソリです。ビューで日付ピッカーを取得する方法を教えてください。すべてのビューを共通に表示するには、日付ピッカー関数をどこに書く必要がありますか。私のすべてのビューでどのようにそれを呼び出すことができますか。

4

2 に答える 2

3

datepickerとして表示する必要があるすべての入力フィールドにいくつかの共通クラスを追加できます。

@Html.TextBoxFor(x => x.SomeDate, new { @class = "date" })

次に、別のjavascriptファイルで：

$(function() {
    $('.date').datepicker();
});

次に、この.jsファイルをレイアウトに含めて、日付クラスを持つ各ページと各入力フィールドに対して実行されるようにするだけです。

于 2012-04-05T06:25:30.843 に答える
2
  1. _Layout.cshtml に次の行を追加します

//CSS

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/redmond/jquery-ui.css" rel="Stylesheet" type="text/css"   />

//スクリプト

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

  1. Shared フォルダーに移動し、そこに EditorTemplates という名前のフォルダーを作成します。

  2. EditorTemplates フォルダー内に、DateTime という部分ビューを作成します。

  3. 次のコードを DateTime 部分ビューに追加します

    @モデル System.DateTime ? @Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { @class = "pickDate" })

        <script type="text/javascript">
         $(document).ready(function () {

             $('.pickDate').datepicker({ 
                 changeMonth: true,
                 changeYear: true
             });
         });
    </script>

これですべての設定が完了し、DateTime タイプのフィールドがあるすべてのビューで、そのフィールド内をクリックしたり、アイコンなどをクリックしてプロパティを変更したりすると、jqueryUI 日付ピッカーが表示されます。

たとえば、ビューはモデルから作成されたものと同じです。何も追加する必要はありません。

<div class="editor-label">
    @Html.LabelFor(model => model.DateOfBirth)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.DateOfBirth)
    @Html.ValidationMessageFor(model => model.DateOfBirth)
</div>

アップデート

おそらく、ある種のスクリプトの衝突があります。追加してみる

@if(false)
{
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
}

あなたのビューの上に。

于 2012-04-05T06:33:59.073 に答える