0

我有一个带有两个日期选择器的日期范围，比如这个演示：

ui 日期选择器演示

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

现在我想用两个单选按钮禁用/启用这个日期范围：“开”和“关”（不是复选框！）。该图标也必须禁用/启用（灰色或非灰色）。

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

这些是我的单选按钮：

<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 });

最后一件事：

当日期被启用并且任何人填写它，并且这个 gfioes 被禁用时，当输入被清除时是否很好。

4

1 回答 1

0

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

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

如果“开”：

启用您的日期选择器

如果“关闭”：

禁用您的日期选择器

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

$( ".selector" ).datepicker({ disabled: true });
于 2012-06-04T15:03:41.423 回答