如何设置结束日期不早于日历中的开始日期?
How can I set endDate not to be earlier than startDate in calendar?
我有日历。它完美运行。
endDate 和 startDate 之间最多可以有 365 天,这行得通。
但是如果我选择 startDate 在 endDate 之前,我可以 select 更早的日期,但我不应该那样做...我做不到,你能帮忙吗?
这是它的相关代码,
$scope.startDateOptions = {
formatYear: "yy",
minDate: getMinDate(),
maxDate: $scope.logVariables.endDate || new Date(),
startingDay: 1
};
function getMinDate(){
var newMinDate = new Date();
if ($scope.logVariables.endDate !== undefined){
newMinDate = new Date($scope.logVariables.endDate.getTime());
}
newMinDate.setDate(newMinDate.getDate() - 365);
return newMinDate;
}
$scope.endDateOptions = {
formatYear: "yy",
maxDate: new Date(),
startingDay: 1
};
$scope.checkEndDateModal = function(){
if ($scope.logVariables.endDate != undefined && $scope.logVariables.startDate != undefined ){
var diffTime = $scope.logVariables.endDate.getTime() - $scope.logVariables.startDate.getTime();
if (diffTime / (1000 * 60 * 60 * 24) > 365){
$scope.logVariables.startDate = getMinDate();
}
//TODO: Check for start date ıs mınımum end dat?e
// set start date to end date
}
}
$scope.open1 = function () {
$scope.startDateOptions = {
formatYear: "yy",
minDate: getMinDate(),
maxDate: $scope.logVariables.endDate || new Date(),
startingDay: 1
};
$scope.popup1.opened = true;
};
$scope.open2 = function () {
$scope.popup2.opened = true;
};
这里是html部分,
<div class="row">
<div class="col-sm-3">
<label for="sel1">{{ 'LISTLOG_SEARCHSTARTDATE' | translate }}:
<!-- <a class="ion-information-circled" tooltip-animation="true" tooltip-placement="top" -->
<!-- uib-tooltip="{{'TOOLTIP_DEVICELOG_SEARCHDATE' | translate}}"></a> -->
</label>
<p class="input-group">
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="logVariables.startDate"
ng-change="formatDateModal()" ng-model-options="{timezone: 'UTC'}" is-open="popup1.opened"
datepicker-options="startDateOptions" close-text="Close" alt-input-formats="altInputFormats" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open1()"><i
class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
<div class="col-sm-3">
<label for="sel1">{{ 'LISTLOG_SEARCHENDDATE' | translate }}:
<!-- <a class="ion-information-circled" tooltip-animation="true" tooltip-placement="top" -->
<!-- uib-tooltip="{{'TOOLTIP_DEVICELOG_SEARCHDATE' | translate}}"></a> -->
</label>
<p class="input-group">
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="logVariables.endDate"
ng-change="checkEndDateModal()" ng-model-options="{timezone: 'UTC'}" is-open="popup2.opened"
datepicker-options="endDateOptions" close-text="Close" alt-input-formats="altInputFormats" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open2()"><i
class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
好吧,我终于解决了,我需要为popup2日历设置minDate
$scope.open2 = function () {
$scope.endDateOptions = {
formatYear: "yy",
startingDay: 1,
minDate: ($scope.logVariables.startDate>$scope.logVariables.endDate) ? $scope.logVariables.endDate:$scope.logVariables.startDate,
maxDate: new Date()
};
$scope.popup2.opened = true;
};
这有效。
我有日历。它完美运行。
endDate 和 startDate 之间最多可以有 365 天,这行得通。
但是如果我选择 startDate 在 endDate 之前,我可以 select 更早的日期,但我不应该那样做...我做不到,你能帮忙吗?
这是它的相关代码,
$scope.startDateOptions = {
formatYear: "yy",
minDate: getMinDate(),
maxDate: $scope.logVariables.endDate || new Date(),
startingDay: 1
};
function getMinDate(){
var newMinDate = new Date();
if ($scope.logVariables.endDate !== undefined){
newMinDate = new Date($scope.logVariables.endDate.getTime());
}
newMinDate.setDate(newMinDate.getDate() - 365);
return newMinDate;
}
$scope.endDateOptions = {
formatYear: "yy",
maxDate: new Date(),
startingDay: 1
};
$scope.checkEndDateModal = function(){
if ($scope.logVariables.endDate != undefined && $scope.logVariables.startDate != undefined ){
var diffTime = $scope.logVariables.endDate.getTime() - $scope.logVariables.startDate.getTime();
if (diffTime / (1000 * 60 * 60 * 24) > 365){
$scope.logVariables.startDate = getMinDate();
}
//TODO: Check for start date ıs mınımum end dat?e
// set start date to end date
}
}
$scope.open1 = function () {
$scope.startDateOptions = {
formatYear: "yy",
minDate: getMinDate(),
maxDate: $scope.logVariables.endDate || new Date(),
startingDay: 1
};
$scope.popup1.opened = true;
};
$scope.open2 = function () {
$scope.popup2.opened = true;
};
这里是html部分,
<div class="row">
<div class="col-sm-3">
<label for="sel1">{{ 'LISTLOG_SEARCHSTARTDATE' | translate }}:
<!-- <a class="ion-information-circled" tooltip-animation="true" tooltip-placement="top" -->
<!-- uib-tooltip="{{'TOOLTIP_DEVICELOG_SEARCHDATE' | translate}}"></a> -->
</label>
<p class="input-group">
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="logVariables.startDate"
ng-change="formatDateModal()" ng-model-options="{timezone: 'UTC'}" is-open="popup1.opened"
datepicker-options="startDateOptions" close-text="Close" alt-input-formats="altInputFormats" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open1()"><i
class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
<div class="col-sm-3">
<label for="sel1">{{ 'LISTLOG_SEARCHENDDATE' | translate }}:
<!-- <a class="ion-information-circled" tooltip-animation="true" tooltip-placement="top" -->
<!-- uib-tooltip="{{'TOOLTIP_DEVICELOG_SEARCHDATE' | translate}}"></a> -->
</label>
<p class="input-group">
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="logVariables.endDate"
ng-change="checkEndDateModal()" ng-model-options="{timezone: 'UTC'}" is-open="popup2.opened"
datepicker-options="endDateOptions" close-text="Close" alt-input-formats="altInputFormats" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open2()"><i
class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
好吧,我终于解决了,我需要为popup2日历设置minDate
$scope.open2 = function () {
$scope.endDateOptions = {
formatYear: "yy",
startingDay: 1,
minDate: ($scope.logVariables.startDate>$scope.logVariables.endDate) ? $scope.logVariables.endDate:$scope.logVariables.startDate,
maxDate: new Date()
};
$scope.popup2.opened = true;
};
这有效。