【问题标题】:Change the month in the second date picker based on the first in angular date picker根据角度日期选择器中的第一个更改第二个日期选择器中的月份
【发布时间】:2015-04-02 10:59:41
【问题描述】:

如何根据第一个日期选择器选择动态更改第二个日期选择器的月份以显示为所选月份?但它显示的是当前日期。 例子: 我从第一次选择器中选择了 15-10-2104。因此,第二个日期选择器应该以 15-10-2014 开始的日期打开。所有以前的日期都应该被禁用。

我正在使用角度引导日期选择器,代码如下:

<label>Start Date <span class="required"></span></label>

<div class="seldate startdate calender-icon nopadding">
    <input type="text" datepicker-popup="dd-MMMM-yyyy"
           ng-model="info.startDate"
           required
           name="startDate" tabindex="4" 
           placeholder="dd/mm/yyyy"
           is-open="startDate.open"
           ng-click="startDate.open = true"
           min-date="minDate" datepicker-options="dateOptions"
           date-disabled="disabled(date, mode)"
           close-text="Close" class="form-control"/>
</div>
</div>

<div class="col-sm-6 form-group">
    <label>End Date <span class="required"></span></label>

    <div class="seldate startdate calender-icon nopadding">
        <input type="text" datepicker-popup="dd-MMMM-yyyy"
               ng-model="info.endDate"
               required

               name="endDate" tabindex="5"
               placeholder="dd/mm/yyyy"
               is-open="endDate.open"
               ng-click="endDate.open = true"
               min-date="scheduleInfo.startDate" datepicker-options="dateOptions"
               date-disabled="disabled(date, mode)"
               close-text="Close" class="form-control"/>
    </div>

</div>

【问题讨论】:

    标签: javascript angularjs date datepicker bootstrap-datepicker


    【解决方案1】:

    在第一个 datepicker 中使用 ng-change 在第二个 datepicker 中设置 min-date。

    ng-change="setMinEndDate()"

    $scope.setMinEndDate = function() {
        var endDate = angular.copy($scope.info.startDate);
        endDate.setDate(endDate.getDate());
        $scope.scheduleInfo.startDate = endDate;
    };
    

    希望,这会有所帮助。

    【讨论】:

    • 当我选择第一个时,我需要在第二个日期选择器中禁用所有以前的日期
    猜你喜欢
    • 2019-07-25
    • 2021-05-19
    • 2012-09-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多