Question

我有两个日期选择器的日期范围，如此演示：

但两个日期字段都有图标触发器。

现在我想通过两个单选按钮禁用/启用此日期范围：'on'和'off'（不带复选框！）。必须禁用/启用图标（灰色或不灰色）。

我找到了很多东西，但不是一个完整的解决方案。

这些是我的单选按钮：

<input class="radiobutton" type="radio" id="flex_ja" value="noch" name="flex" /><label for="flex">Yes</label>
<input class="radiobutton" type="radio" id="flex_nein" value="nicht mehr" name="flex"/><label for="flex">No</label>

这些是我的日期选择范围输入：

<input id="min_anreise" name="min_anreise" placeholder="Frühestes Anreisedatum"/>
<input id="max_abreise" name="max_abreise" placeholder="Spätestes Abreisedatum"/>

这是来自ui演示网站的javascript代码

        $(function() {
    var dates = $( "#min_anreise, #max_abreise" ).datepicker({
        onSelect: function( selectedDate ) {

        $('#Form').validate().element('#max_abreise');
        $('#Form').validate().element('#min_anreise');

            var option = this.id == "min_anreise" ? "minDate" : "maxDate",
                instance = $( this ).data( "datepicker" ),
                date = $.datepicker.parseDate(
                    instance.settings.dateFormat ||
                    $.datepicker._defaults.dateFormat,
                    selectedDate, instance.settings );
            dates.not( this ).datepicker( "option", option, date );
            }
            });
        });

我如何将此组合用来切换日期与无线电台？

使用图标禁用日期输入的唯一方法是：

$( ".selector" ).datepicker({ disabled: true });

最后一件事：

当日期启用并且任何人填写此内容并且此gfio禁用时，输入被清除时是正常的。

Answer 1

将onclick事件绑定到您的单选按钮。

在onclick事件处理程序中，检查单选按钮的状态（'on'或'off'）

如果'开'：

启用日期选择器

如果'关闭'：

停用日期选择器

启用和禁用日期选择器可以使用您发布的代码完成：

$( ".selector" ).datepicker({ disabled: true });

禁用/启用（切换）两个单选按钮上的日期选择器（范围）

1 个答案: