Vergleichen Termine Felder in angularjs datepicker

Ich versuche zu vergleichen, werden zwei input-text-Felder , mit datepicker-angular-ui befestigt.

Sich die Felder Beginn-Datum und Ende-Datum auf http://jsfiddle.net/iamkhush/8Rezs/23/.

Habe ich versucht, um zu befestigen Sie diese Funktion auf on (ng-ändern , aber realisiert es nicht funktionieren datepicker nicht erlaubt.

 $scope.datechange = function(){
     if($scope.enddt < $scope.startdt){
        $scope.enddt = '';
    };

Ich kann nicht herausfinden, wie das überschreiben der Richtlinie , wenn Sie benötigt wird.
Auch ich möchte, dass der datepicker soll verstecken, wenn die input-Felder nicht im Fokus.

InformationsquelleAutor iamkhush | 2013-07-20

  1. 1

    Geändert fiddle leicht für den Vergleich der Daten. Überprüfen Sie heraus dieses fiddle. Die änderungen sind:

    $scope.$watch('startdt', function(newval, oldval){
    if($scope.enddt < $scope.startdt) {
        $scope.enddt = '';
    };
});

$scope.$watch('enddt', function(newval, oldval){
    if($scope.enddt < $scope.startdt) {
        $scope.enddt = '';
    };
});

    Ive die Freiheit genommen, Sie zu deaktivieren Sie die Felder mit Sternchen, da sonst die Benutzer eingeben können, ein ungültiges Datum in das Textfeld ein. Auch die Logik ist in einer solchen Weise, dass, wenn Sie geben Sie ein Startdatum, das ist niedriger als die "endDate" und anschließend ändern Sie das Startdatum werden nach den endDate, endDate zurückgesetzt. IOW, das start-Datum-Steuerelemente alles. Bitte ändern, wie pro Ihre Notwendigkeiten.

    Auch, zum ein - /ausblenden auf der Grundlage der text-Feld, schauen Sie auf die dropdown-Richtlinie in angular-ui. Ich habe nicht in der Geige, aber es sollte machbar sein mit einer Kombination von dropdown und datepicker.

    Hey, es funktioniert :), aber ich kann den code sehen, ist ähnlich dem, was ich hatte experimentierte mit. Ich hatte gerade überprüft es wieder, wenn ich gerade das zweite watch-Funktion, es funktioniert nicht. Können Sie bitte erläutern Sie mir diese.
    Die Kombination von den 2 $ - Uhren sind, so dass, wenn Sie ändern jede der beiden datepickers, der andere ist, überprüft werden, wie gut. Was funktioniert nicht, wenn Sie nur die zweite Funktion.
    Gut , die Logik, die nicht arbeiten, früher, aber jetzt ist es, wie durch ein Wunder.
    Die kleine Veränderung, die ich machte, war die Verwendung von $scope.$Uhr anstelle von $scope.zu sehen, die nicht existieren. Und die Logik der Uhr, die beide von Datum und bis-Datum, das ist alles 🙂

    InformationsquelleAutor rajasaur

  2. 1

    Bisschen spät für eine Antwort, aber wenn u wollen einfach nur, um zu vergleichen, um Daten unter Verwendung von angular-ui-datetime-picker können Sie die folgende Anweisung verwenden, die ich erstellt habe, auch im Vergleich zu date-Wert mithilfe moment.js. Diese Richtlinie erfordert moment.js Datei, aber Sie können auch tun, ohne es aber peronally denke ich moment.js ist toll für die date-Funktion in javascript. es gibt Sie in der Richtlinie die vergleicht, Datum folgende 

    mainApp.directive("dateGreaterAndEqual", function () {
    return {
        restrict: 'A', //only activate on element attribute
        require: '?ngModel', //get a hold of NgModelController

        link: function (scope, elem, attrs, ngModel) {
            if (!ngModel) return; //do nothing if no ng-model

            //watch own value and re-validate on change
            scope.$watch(attrs.ngModel, function () {
                validate();
            });

            //observe the other value and re-validate on change
            attrs.$observe('dateGreaterAndEqual', function (val) {
                validate();
            });

            var validate = function () {
                //values
                var dateTo = angular.isDefined(ngModel.$viewValue) === true && !_.isNull(ngModel.$viewValue) ? moment(ngModel.$viewValue).toDate() : null;
                var dateFrom = attrs.dateGreaterAndEqual !== "" ? moment(attrs.dateGreaterAndEqual.replace('"', '').replace('\\', '').replace('"', '')).toDate() : null;
                //passing date with braces around it causes and issue therfore we need to use replace

            };
        }
    }

});

    dateTo und dateFrom ist der Wert, den Sie brauchen. müssen Sie folgenden html-markup zu verwenden, es

                             <p class="input-group">
                            <input type="text" class="form-control" data-datepicker-popup="{{Model.DateFormat}}"
                                   ng-model="Model.ProcedureDateTo"
                                   data-is-open="openedTo" data-min-date="Model.MinDate"
                                   data-max-date="Model.MaxDate"
                                   data-datepicker-options="dateOptions" data-date-disabled="disabled(date, mode)"
                                   ng-required="false" data-close-text="{{Close}}" data-date-greater-and-equal="{{Model.ProcedureDateFrom}}" />
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-default" ng-click="openTo($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                            </span>
                        </p>

    Den key in dieser Zeile ist

    Daten-Datum-größer-und-gleich - ="{{Model.ProcedureDateFrom}}", die übergeben, um die Richtlinie für den Vergleich.

    InformationsquelleAutor Atul Chaudhary

Schreibe einen Kommentar