Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Moran 270 posts 868 karma points
    Sep 22, 2019 @ 06:36
    Moran
    0

    Date picker - From Date and To Date

    Hi I want to build a simple “from date” and “to date” data type so in the “to date” I won’t be able to select a date that is smaller than “from date”.

    I have built a package that contains two date pickers and created a new data type, and tried listening to the scope event using $watch function, but it created an error related to $digest object.

    The controller:

    angular.module("umbraco")
        .controller("Moranmono.RangeDatePickerController", function ($scope) {
            var today = new Date();
            $scope.day = today.getDate();
            $scope.month = today.getMonth();
            $scope.year = today.getFullYear();
    
            $scope.datepickerFrom = {
                view: 'datepicker',
                config: {
                    pickDate: true,
                    pickTime: false,
                    pick12HourFormat: false,
                    format: "DD/MM/YYYY",
                    minDate: moment({ y: $scope.year, M: $scope.month, d: $scope.day })
                },
            };
    
            $scope.datepickerTo = {
                view: 'datepicker',
                config: {
                    pickDate: true,
                    pickTime: false,
                    pick12HourFormat: false,
                    format: "DD/MM/YYYY",
                    minDate: moment({ y: $scope.year, M: $scope.month, d: $scope.day })
                },
            };
        });
    

    The html file:

    <div class="rangedatepicker" ng-controller="Moranmono.RangeDatePickerController">
        <form name="insertkeyvalue_form" novalidate ng-submit="submit(datepicker.value)">
            <div class="tab-content umb-control-group">
                <label class="control-label">Date From</label>
                <umb-editor model="datepickerFrom"></umb-editor>
            </div>
            <div class="tab-content umb-control-group">
                <label class="control-label">Date To</label>
                <umb-editor model="datepickerTo"></umb-editor>
            </div>
        </form>
    </div>
    

    The watch function I tried, but created error in the console:

    $scope.$watch('datepicker', function () {
       if ($scope.datepicker != undefined && $scope.loaded) {
           $scope.form.PubDate = $scope.datepicker.value;
       }
    }, true);
    
  • Simon steed 357 posts 665 karma points
    Jun 01, 2020 @ 15:07
    Simon steed
    0

    Hi - just wondering if you ever got to the bottom of this?

  • Moran 270 posts 868 karma points
    Jun 01, 2020 @ 15:27
    Moran
    0

    I managed to get a partial result with this code:

    function CompareDates(dateFromString, dateToString) {
            var dateFrom = new Date(dateFromString);
            var dateTo = new Date(dateToString);
    
            if (dateTo < dateFrom) {
                return false;
            }
            return true;
        }
    

    but the error message appears after the submit.

Please Sign in or register to post replies

Write your reply to:

Draft