jQuery:启用/禁用日期选择器

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18350923/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 21:25:26  来源:igfitidea点击:

jQuery: enabling/disabling datepicker

jquerydatepicker

提问by A K

In my php-file, I want to use the jQuery Datepicker.

在我的 php 文件中,我想使用 jQuery Datepicker。

When my file loads, I create the Datepicker disabled.

当我的文件加载时,我创建了禁用的 Datepicker。

Then, when a special field in my php-file (it is a form) is filled, I want to enable the Datepicker.

然后,当我的 php 文件(它是一个表单)中的一个特殊字段被填充时,我想启用 Datepicker。

So, initially my Datepicker looks like this:

所以,最初我的 Datepicker 看起来像这样:

$("#from").datepicker({
    showOn: "both",
    buttonImage: "calendar.gif",
    buttonImageOnly: true,
    buttonText: "Kalender",
    showAnim: "drop",
    dateFormat: "dd.mm.yy",
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    showWeek: true,
    firstDay: 1,
    dayNamesMin: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
    weekHeader: "KW",
    disabled: true,
    onClose: function(selectedDate) {
        $("#to").datepicker("option", "minDate", selectedDate);
    }
});

This works just fine, no problem so far. The problem comes, when I want to disable the field.

这工作得很好,到目前为止没有问题。问题来了,当我想禁用该字段时。

If a special field is filled, I call $("#from").datepicker('enable');

如果填写了特殊字段,我会打电话 $("#from").datepicker('enable');

This also works fine, BUT now I want to disable it again if the special field I mentioned it empty again.

这也可以正常工作,但现在我想再次禁用它,如果我提到的特殊字段再次为空。

Then I use $("#from").datepicker('disable');and the field itself is grayed, but I can still use the field to enter values, the calender pops up and even the calender-image next to the box is clickable.

然后我使用$("#from").datepicker('disable');,字段本身变灰,但我仍然可以使用该字段输入值,日历弹出,甚至框旁边的日历图像也是可点击的。

Anyone has an idea why this is the case? Am I missing something?

任何人都知道为什么会这样?我错过了什么吗?

回答by koala_dev

$("#from").datepicker('disable');should work, but you can also try this:

$("#from").datepicker('disable');应该可以,但你也可以试试这个:

$( "#from" ).datepicker( "option", "disabled", true );

回答by Shaun Hare

Also set the field to disabled when you disable the datePicker e.g

当您禁用 datePicker 例如时,还将该字段设置为禁用

$("input").prop('disabled', true);

To stop the image being clickable you could unbind the click event on that

要停止图像可点击,您可以取消绑定点击事件

$('img#<id or class ref>').unbind('click');

回答by Kanishka Panamaldeniya

try

尝试

$("#from").datepicker().datepicker('disable');

回答by Chinthaka Dinadasa

$("#nicIssuedDate").prop('disabled', true);

This is works 100% with bootstrap Datepicker

这是 100% 使用bootstrap Datepicker 工作的

回答by Arzon Barua

simply use the following code

只需使用以下代码

$("#from").datepicker({
 showOn: "off"
});

it will not show the display of datepicker

它不会显示日期选择器的显示

回答by ss_mj

$('#ElementID').unbind('focus');

did the trick for me !!

为我做的伎俩!

回答by sathya

I am also having This Error!

我也有这个错误!

Then i change this

然后我改变这个

$("#from").datepicker('disable');

to This

到这

$("#from").datepicker("disable");

mistake : single and double quotes..

错误:单引号和双引号..

Now its Work fine for me..

现在它对我来说工作正常..

回答by Willy David Jr

This works for me on toggling enable and disable datepicker of JQuery:

这对我来说在切换启用和禁用 JQuery 的日期选择器时有效:

if (condition) {
          $('#ElementID').datepicker(); //Enable datepicker                   
} else {
         //Disable datepicker without the ability to enter any character on text input
          $('#ElementID').datepicker('destroy');
          $('#ElementID').attr('readonly', true); }

I don't know why but when I use enable/disablein datepicker options, it doesn't behave the way it should be. It only works after you enable and disable it, but once you disable it, it doesn't enable again after, so the code above works perfectly fine for me:

我不知道为什么,但是当我在 datepicker 选项中使用启用/禁用时,它的行为不应该是这样。它仅在您启用和禁用它后才有效,但是一旦您禁用它,它就不会再次启用,因此上面的代码对我来说非常好:

if (condition) {
      $('#ElementID').datepicker('enable'); //Enable datepicker                   
} else {
      //Disable datepicker but I cannot enable it again once it goes through this condition
      $('#ElementID').datepicker('disable');  }

回答by alexandrubarbat

Datepicker is disabled automatically when the input text field is made disabled or readOnly:

当输入文本字段被禁用或只读时,日期选择器会自动禁用:

$j("#" + CSS.escape("${status.expression}")).datepicker({
    showOn: "both",
    buttonImageOnly: true,
    buttonImage: "<c:url value="/static/js/jquery/1.12.1/images/calendar.gif"/>",
    dateFormat: "yymmdd",
    beforeShow: function(o, o2) {
    var ret = $j("#" + CSS.escape("${status.expression}")).prop("disabled")
        || $j("#" + CSS.escape("${status.expression}")).prop("readOnly");

    if (ret){
        return false;
    }

    return o2;
}
});

回答by Zagor Te Nej

This is what worked for me

这对我有用

$("#from").attr("disabled", true);