JQuery скрипты внутри файлов каталог EditorTemplate не работают

Question

Я в настоящее время чтения ASP.NET MVC Succintly книги, и некоторые примеры не работают должным образом, одна из них заключается в следующем:

Я создал проект из ASP.NET MVC 4 (.NET 4.5) шаблон, а в модели сотворенный этот ItineraryItem класса:

public class ItineraryItem {  
     public DateTime? When { get; set; }  
     public string Description { get; set; }  
     public int? Duration { get; set; }  
     public bool IsActive { get; set; }  
     public bool? Confirmed { get; set; } 
} 

Это мнение:

@model AbacoASP.Models.ItineraryItem 
<h2>Create</h2> 
<div class="editor"> 
    @using (Html.BeginForm()) 
    { 
     @Html.ValidationSummary(true) 
     @Html.EditorFor(m=>m) 
     <p><input type="submit" value="Save" /></p> 
    } 
</div> 

Затем я создал пользовательский редактор для DateTime в \ Views \ Shared \ EditorTemplates DateTime.cshtml:

@model DateTime? 
@Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { @class = "datePicker" , @readonly = "readonly"}) 

Тогда предлагаю добавить этот скрипт ... но не там, где. Я думаю, к тому же DateTime.cshtml в теге сценария:

$(".datePicker").datepicker( 
    {  
     showOn: "button", 
     gotoCurrent: true, 
     showAnim: 'fold', 
     buttonImage: "/Content/calendar.png", 
     buttonImageOnly: true 
}) 

Там очень похожий пример, который не работает, либо, когда я создаю Phone.cshtml я получаю в консоли $ is not defined, это его содержание:

@model string 

@{ 
    var areaCode = string.Empty; 
    var firstNumber = string.Empty; 
    var secondNumber = string.Empty; 
    if (Model != null) { 
     areaCode = Model.Substring(0, 3); 
     firstNumber = Model.Substring(3, 3); 
     if (Model.Length >= 10) { 
      secondNumber = Model.Substring(6, 4); 
     } 
    } 
} 
<input type="text" name="area_code" id="area_code" 
     maxlength="3" size="3" value="@areaCode" /> - 
<input type="text" name="number1" id="number1" 
     maxlength="3" size="3" value="@firstNumber" /> - 
<input type="text" name="number2" id="number2" 
     maxlength="4" size="5" value="@secondNumber" /> 
<input type="hidden" name="@ViewData.TemplateInfo.HtmlFieldPrefix" 
     id="@ViewData.TemplateInfo.HtmlFieldPrefix" value="@Model" /> 
<img src="../../../Content/images/Edit32.png" id="phoneNumberEdit" /> 
<input type="text" name="unparsed" id="unparsed" /> 
<script type="text/javascript"> 
    $(document).ready(function() {   
     $("#unparsed").hide();   
     var edit = $("#phoneNumberEdit");   
     edit.click(function() { $("#unparsed").toggle(); });   
     var phone = $('#area_code, #number1, #number2');   
     phone.autotab_magic().autotab_filter('numeric'); 
     $("#unparsed").change(function() {    
      var unparsed = $("#unparsed");    
      var value = unparsed.val(); 
      value = value.replace(/\(|\)|\s|\-/gi, '');    
      value = value.replace(/[a-zA-Z]+/gi, '');    
      unparsed.val(value);    
      $("#area_code").val(value.substring(0, 3));    
      $("#number1").val(value.substring(3, 6));    
      $("#number2").val(value.substring(6, 10));    
      if (value.length == 10)     
       unparsed.hide();    
      var result = ($('#area_code').val()     
       + $("#number1").val()     
       + $("#number2").val());    
      $("#@ViewData.TemplateInfo.HtmlFieldPrefix")     
       .val(result);   
     });   
     phone.blur(function() {    
      var result = ($('#area_code').val()     
       + $("#number1").val()     
       + $("#number2").val());    
      $("#@ViewData.TemplateInfo.HtmlFieldPrefix") 
      .val(result); 
     }); 
    }); 
</script> 

Edit: Принятый ответ на это предложил question не работает, и ответы не помогают вообще.

Update: мне пришлось вручную добавить следующее _Layout.cshtml внутри:

@Scripts.Render("~/bundles/jquery") 
@Scripts.Render("~/bundles/jqueryui") 

Я не знаю, почему JQuery включен в скриптах не работает из коробки. Даже изменил, что Datepicker не отображается должным образом, я получил ошибку 404 для «Calendar.png» и не стилирую для этого.

Answer 1

Вы должны добавить две ссылки там: один для основной библиотеки Jquery и второй для даты Jquery Ui подборщика

http://jquery.com/

https://jqueryui.com/