最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How can I default to placeholder for date picker? - Stack Overflow

programmeradmin3浏览0评论

Here's the code for my date picker:

<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>

I tried this solution but it did not work:

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

Here's the code for my date picker:

<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>

I tried this solution but it did not work:

 var datePicker = $("#Date").data('kendoDatePicker');
 datePicker.input.val(input.attr('placeholder'));
Share Improve this question asked Jan 27, 2015 at 21:31 Kala JKala J 2,0704 gold badges46 silver badges86 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 5

The easiest way is:

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

but you can also do:

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

Remember that element in DatePicker refers to the original input element.

Check both methods in the following code snippet.

$(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./2014.3.1316/styles/kendo.mon.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic./2014.3.1316/styles/kendo.default.min.css">
<script src="http://code.jquery./jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic./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"/>

发布评论

评论列表(0)

  1. 暂无评论