Question

我正在使用jquery-ui-1.10.4.js和ASP MVC。在我的视图中，我接受一个可选日期作为输入;

@Html.EditorFor(model => model.Assessment.SsipAccreditationDate)

我有一个编辑器模板，它注入了datepicker类;

 @model DateTime?  
 @Html.TextBox("", (Model.HasValue ? Model.Value.ToLongDateString() : string.Empty), 
    new { @class = "datePicker", @style = "width:200px;" })

我有jquery代码将datepicker与日期字段挂钩;

if ($(".datePicker").length) {
    $(".datePicker").datepicker({ showOn: 'both', dateFormat: constantDateFormat, changeMonth: true, changeYear: true })
        .next('button.ui-datepicker-trigger')
        .attr("tabIndex", "-1");
}

加载视图时，如果此日期字段为空，则会自动显示日期选择器。我希望只有当用户点击它或相关按钮时才会显示日期选择器。这就是showOn：两种配置都意味着实现。请注意，在jquery中，tab索引设置为-1，因此显示datepicker的原因不能与焦点字段有关。那么如何停止显示何时加载View的日期选择器？

Answer 1

您可以使用defaultDate属性将其停用。

$(".datePicker").datepicker({
        defaultDate: ''
})

Answer 2

我认为这不是最佳答案，但我发现我可以通过最初禁用datepicker，然后在点击后启用它来完成此操作;

$(document).ready(function () {
    initialiseEdit();
});

var initialiseEdit = function () {

    // Disable the datepicker to ensure the datepicker is not shown when the page is loaded
    $('#Assessment_SsipAccreditationDate').datepicker("disable");

    // Class to stop the control from looking disabled
    $('#Assessment_SsipAccreditationDate').addClass('inputBox');
};

// This code is to make the datepicker function as though it is enabled, whether it is or not.
$('.clickEnable').click(function () {
    $('#Assessment_SsipAccreditationDate').datepicker("enable");
    $('#Assessment_SsipAccreditationDate').datepicker("show");
});

因为'#Assessment_SsipAccreditationDate'被禁用，我不得不用包含clickEnable类的span包装它并将click事件放在其上。

如果没有输入日期，如何在默认情况下停止显示日期选择器

2 个答案: