从和到目前为止,选择器允许选择' x'个月

时间:2017-03-28 07:56:35

标签: angularjs datepicker angular-ui-bootstrap

<div class="col-md-4 col-sm-6">
  <div class="row spacer">
    <label for="fromdate" class="col-md-4">Date : </label>
    <div  class="col-md-8"> 
      <div class="row">
        <div  class="col-md-6"> 
          <input type="text" autofocus="autofocus" class="form-control input-sm" size="10" uib-datepicker-popup="{{'dd-MM-yyyy'}}" ng-model="srchctrl.startDate" is-open="srchctrl.status.openedS" datepicker-options="srchctrl.dateOptions" uib-tooltip="dd-MM-yyyy" date-disabled="srchctrl.disabled(date)" show-weeks='false' close-text="Close" ng-click="srchctrl.open('S')" placeholder="dd-mm-yyyy" alt-input-formats="srchctrl.altInputFormats" ng-change="srchctrl.validateDateRange('main')"/>
          <button type="button" class="datepicker-btn" ng-click="srchctrl.open('S')"><i class="fa fa-calendar"></i></button>
        </div>
        <div class="col-md-6">                            
          <input type="text" class="form-control input-sm"  size="10" uib-datepicker-popup="{{'dd-MM-yyyy'}}" ng-model="srchctrl.endDate" is-open="srchctrl.status.openedE"  datepicker-options="srchctrl.dateOptions" uib-tooltip="dd-MM-yyyy" date-disabled="srchctrl.disabled(date)" show-weeks='false' close-text="Close" ng-click="srchctrl.open('E')"  placeholder="dd-mm-yyyy" alt-input-formats="srchctrl.altInputFormats"  ng-change="srchctrl.validateDateRange('main')"/>
          <button type="button" class="datepicker-btn"  ng-click="srchctrl.open('E')" ><i class="fa fa-calendar"></i></button>
        </div>
      </div>
    </div>
  </div>
</div>

日期选择器都允许选择日期选择日期&#39; x&#39;个月。

假设x为3,那么如果我选择15-01-2017,则其他日期将仅允许到15-04-2017。

如何在日期选择器中实现此目的?

1 个答案:

答案 0 :(得分:0)

使用max-date属性

 <div class="col-md-4 col-sm-6">
                              <div class="row spacer">
                                <label for="fromdate" class="col-md-4">Date : </label>
                                <div  class="col-md-8"> 
                                  <div class="row">
                                   <div  class="col-md-6"> 
                                      <input type="text" autofocus="autofocus"  class="form-control input-sm"  size="10" uib-datepicker-popup="{{'dd-MM-yyyy'}}" ng-model="srchctrl.startDate" is-open="srchctrl.status.openedS"  datepicker-options="srchctrl.dateOptions" uib-tooltip="dd-MM-yyyy" date-disabled="srchctrl.disabled(date)" show-weeks='false' close-text="Close" ng-click="srchctrl.open('S')"  placeholder="dd-mm-yyyy"  alt-input-formats="srchctrl.altInputFormats"  ng-change="srchctrl.validateDateRange('main')"/>
                                      <button type="button" class="datepicker-btn" ng-click="srchctrl.open('S')"><i class="fa fa-calendar"></i></button>
                                   </div>
                                   <div  class="col-md-6">                            
                                      <input type="text" class="form-control input-sm"  size="10" uib-datepicker-popup="{{'dd-MM-yyyy'}}" ng-model="srchctrl.endDate" is-open="srchctrl.status.openedE"  datepicker-options="srchctrl.dateOptions" uib-tooltip="dd-MM-yyyy" date-disabled="srchctrl.disabled(date)" show-weeks='false' close-text="Close" ng-click="srchctrl.open('E')"  placeholder="dd-mm-yyyy" alt-input-formats="srchctrl.altInputFormats"  ng-change="srchctrl.validateDateRange('main')"/>
                                      <button type="button" class="datepicker-btn"  ng-click="srchctrl.open('E')"  max-Date="maxDate"><i class="fa fa-calendar"></i></button>
                                   </div>
                                  </div>
                                </div>
                                </div>
                            </div>

在控制器中

$scope.maxDate=srchctrl.startDate;

//在控制器opon函数srchctrl.open('E')

var month=srchctrl.startDate.getMonth();

$scope.maxDate.setMonth(month+3);