jQuery DatePicker MVC4 EditorFor

Question

Potrzebuję użyć datepicker w polu EditorFor.

Mój kod dla widoku jest:

<div class="editor-label"> 
    @Html.Label("birthDate","birthDate") 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.birthDate, new { @class = "datepicker"}) 
    @Html.ValidationMessageFor(model => model.birthDate) 
</div> 

Skrypt:

<script type="text/javascript"> 
$(document).ready(
    function() { 
     $('.datepicker').datepicker({ 
      changeMonth: true, 
      changeYear: true, 
      minDate: "-99Y", 
      dateFormat: "dd/mm/yyyy" 
     }); 
    }); 

Nie mogę tego dokonać. Mam następujący błąd: Błąd środowiska wykonawczego Microsoft JScript: Obiekt nie obsługuje tej właściwości lub metody "datepicker".

już załadowany jQuery przed próbuję wywołać funkcję.

Answer 1

@Html.EditorFor(model => model.birthDate, new { @class = "datepicker"}) 

nie będzie działać, ponieważ "EditorFor" nie będzie akceptować (przejść do DOM) Class.

Więc trzeba użyć „TextBoxFor” który zaakceptuje klasy lub jeszcze lepiej, stworzyć EditorTemplate obsługiwać dowolne pole, które jest DateTime i dodaj tam klasę. This link szczegóły, jak zrobić szablon.

Gdy masz klasy robotniczej (może być weryfikowana w kodzie źródłowym), reszta jest po prostu przedstawieniu kodu jQuery. Używam i aktywuję go skryptem, który już posiadasz. Zobacz, czy nazwa ".datepicker" jest dokładnie taka sama jak klasa.

Answer 2

EditorFor przyjąć klasę dla mnie

@Html.EditorFor(model => model.Birthday, new { htmlAttributes = new { @class = "datepicker",@Name="birthday",@PlaceHolder = "mm/dd/yyyy" } }) 

znaczniki HTML

class="datepicker text-box single-line" 

zajęć jest praca.

Answer 3

miałem simmilar problem, rozwiązać, korzystając z funkcji HTML5, który posiada wsparcie dla datetime, w przykładzie Sugerowałbym próbuje somthing tak:

<div class="editor-label"> 
    @Html.Label("birthDate","birthDate") 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.birthDate, new { @class = "datepicker", type="datetime-local"}) 
    @Html.ValidationMessageFor(model => model.birthDate) 
</div> 

jedyną rzeczą, która dodaje, jest rodzajem = „datetime-local”