datetimepicker в MVC3.0

Question

Мой сборщик Datetime отлично работает для «Html.TextBoxFor», но когда у меня есть «Html.EditorFor», он не показывает anydatepicker.

я есть Jquery следующим образом:

$(document).ready(function() { 
       $('.dp').datepicker({ 
        changeMonth: true, 
        changeYear: true, 
        dateFormat: 'yy-mm-dd' 
       }); 
      }); 

Я хочу использовать эту функцию в моей странице .aspx.

<div class="float-left"> 
<%: Html.Label("BAASent Date") %> 
<br /> 
<%:Html.TextBoxFor(model => model.BAASentDate, new { @class = "dp" }) %> 
<%: Html.ValidationMessageFor(model => model.BAASentDate) %> 
</div> 

для вышеуказанного кода все работает нормально. , но когда я заменяю «Html.TextBoxFor» на «Html.EditorFor», он не отображает ни один сборщик времени.

Whats going неправильный здесь?

Answer 1

При использовании EditorFor вы, вероятно, не применять dp класс к соответствующему полю ввода и поэтому $('.dp') селектор, который вы используете для deatepicker ничего не возвращает.

Одна возможность состоит в том, чтобы применить класс родительского DIV:

<div class="float-left dp"> 
    <%= Html.Label("BAASent Date") %> 
    <br /> 
    <%= Html.EditorFor(model => model.BAASentDate) %> 
    <%= Html.ValidationMessageFor(model => model.BAASentDate) %> 
</div> 

, а затем настроить переключатель так, что вы запрашиваете поле ввода, которое находится внутри DIV с заданным именем класса:

$(document).ready(function() { 
    $('.dp :input').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'yy-mm-dd' 
    }); 
}); 

Другой возможностью является создание настраиваемого шаблона редактора для поля DateTime, в котором вы должны применить класс dp к TextBox. Так внутри ~/Views/Shared/EditorTemplates/DateTime.ascx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %> 
<%= Html.TextBox(
    "", 
    ViewData.TemplateInfo.FormattedModelValue, 
    new { @class = "text-box single-line dp" } 
) %> 

, а затем:

<div class="float-left"> 
    <%= Html.Label("BAASent Date") %> 
    <br /> 
    <%= Html.EditorFor(model => model.BAASentDate) %> 
    <%= Html.ValidationMessageFor(model => model.BAASentDate) %> 
</div> 

и, наконец:

$(document).ready(function() { 
    $('.dp').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'yy-mm-dd' 
    }); 
});