2017-09-15 17 views
-1

まず、私の英語をお許しください。 MVCでWebアプリケーションを実行しており、jQueryのdatepickerをモデルのプロパティにバインドする際に問題があります。私はdatepickerをModel properitiesにバインドすると(以下のコードで "test"のように)、すべて動作しますが、私自身のクラスを含むモデルがあり、そのクラスにはdatepickerをバインドする必要があるプロパティが含まれています。 ViewModelにMVCバインドjQuery日付ピッカー

public class Filtr 
{ 
    [Display(Name = "Date from:")] 
    public DateTime? DatumFrom { get; set; } 

    [Display(Name = "Date to:")] 
    public DateTime? DatumTo { get; set; } 
} 

中...

のViewModel

public class MainViewModel 
{ 
    //ViewModel 
    public Filtr Fil { get; set; } 
    public DateTime test { get; set; } 

} 

クラスIndex.cshtml

@model aAKV.Models.MainViewModel 
. 
. 
.  
<script> 
    $(document).ready(function() { 
     jQuery('#Fil.DateFrom').datetimepicker({ 
      lang: 'cs', 
      formatDate: 'd.m.Y', 
      formatTime: 'H:i', 
      format: 'd.m.Y H:i', 
      dayOfWeekStart: 1, 
      step: 15, 
      timepicker: true, 
      mask: true 
     });    

    }); 
</script> 
} 
@using (Html.BeginForm()) 
{ 

<div class="form-group"> 
    <div class="col-sm-3"> 

     @Html.LabelFor(Model => Model.Fil.DateFrom) 
      @Html.TextBoxFor(model => model.Fil.DateFrom, new { @class = "date-picker" }) 
. 
. 
. 
012の一部

ありがとうございました

+1

コードが生成しているhtmlを見てください - その 'jQuery( '#Fil_DateFrom')' - '_'(アンダースコア) (ドット) –

答えて

0

代わりにCSSクラスセレクタを使用してください、あなたのコードが動作しない理由があります。 Not Fil.DateFrom

あなたはあなたの条件に基づいて、オプションのいずれか試すことができます。

1)あなたはそれを変更することができます。$('#Fil_DateFrom').datetimepicker({

2)しかし、上記idはあなたのコードを見て、他のいくつかのいずれかを混乱させるとなるかもしれません彼らはFil_DateFromがどこから来ているのか疑問に思います。ですから、このような入力にユニークidを割り当てることができます。

@Html.TextBoxFor(model => model.Fil.DateFrom, new { id="date-from", @class ="date-picker"}) 

そして、スクリプト内$('#date-from').datetimepicker({

3)別のオプション、classに基づいてターゲットに次のようになります。

$('.date-picker').datetimepicker({:これにより、datepickerが追加され、の入力がdate-pickerクラスに追加されます。 settingsと異なるdatepickersが必要な場合は、この方法は機能しません。

DateFrom datepickerで週末を無効にしたいが、週末はDateTo datepickerで週末を許可したいとします。次に、両方の入力にユニークなidを割り当てて、アプローチ2に従わなければなりません。

0

IDは、(adigaで説明されているように)別の方法でレンダリングされます。また、画面に複数の日付ピッカーを配置する予定がある場合は、IDの代わりにcssクラスを使用する方がよいので、一度にすべてに適用されます。 @Html.TextBoxFor()は、IDとしてFil_DateFromと入力を作成するため

jQuery('.date-picker').datetimepicker({

+0

ありがとう、それは私のために働く! –

関連する問題