Как я могу по умолчанию заполнить для выбора даты?

Question

Вот код для моего выбора даты:

<div class="editor-field"> 
        @(Html.Kendo().DatePickerFor(model => model.Date) 
         .HtmlAttributes(ViewBag.Disabled ? (object)new { @class = "formDatePicker", disabled = "disabled", @id = "Date", style = "width:150px", placeholder = "Select Date" } : new { @class = "formDatePicker", @id = "Date", style = "width:150px", placeholder = "Select Date" }) 
         .Events(e => e.Open(@<text>function(e){BrowserCompatibility.DisableDatePickerYearsOnSomeBrowsers(e);}</text>)) 
         .Format(@HCulture.GetShortDateFormat()) 
         .Events(e => e.Change(@<text>function(e){ 
          $("#DateString").val($('#Date').val()); 
          checkInputValid(); 
          }</text>)) 
        ) 
       </div> 

Я попытался это решение, но это не сработало:

var datePicker = $("#Date").data('kendoDatePicker'); 
datePicker.input.val(input.attr('placeholder')); 

Answer 1

Самый простой способ:

$("#Date").attr("placeholder", "type date"); 

но вы также можете do:

var datePicker = $("#Date").data('kendoDatePicker'); 
datePicker.element.attr("placeholder", "type date"); 

Помните, что element в DatePicker относится к оригиналу input элемент.

Проверьте оба метода в следующем фрагменте кода.

$(document).ready(function() { 
 
    $("#Date").kendoDatePicker({ 
 
    }); 
 

 
    $("#change1").on("click", function() { 
 
    $("#Date").attr("placeholder", "type date 1"); 
 
    }); 
 
    $("#change2").on("click", function() { 
 
    var datePicker = $("#Date").data('kendoDatePicker'); 
 
    datePicker.element.attr("placeholder", "type date 2"); 
 
    }); 
 
});

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.common.min.css"> 
 
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.default.min.css"> 
 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
 
<script src="http://cdn.kendostatic.com/2014.3.1316/js/kendo.web.min.js"></script> 
 

 
<button class="k-button" id="change1">Change Method 1</button> 
 
<button class="k-button" id="change2">Change Method 2</button> 
 
<input id="Date" disabled="disabled"/>