Copied to clipboard

Flag this post as spam?

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


  • Max 80 posts 437 karma points
    Nov 29, 2017 @ 14:30
    Max
    0

    Trigger $dirty Datepicker on "clear date" or change

    I can't get my datepicker to go dirty on change or when it's cleared.

    Is there a configuration I need to add to make $dirty work on the ng-form?

    CONTROLLER:

     $scope.StartTime = {
        model: {
            editor: "Umbraco.DateTime",
            label: 'Start Time',
            description: 'Enter the date/time the meeting will start.',
            hideLabel: false,
            view: "datepicker",
            alias: 'StartTime',
            value: "",
            required: true,
            validation: {
                mandatory: true,
                pattern: ""
            },
            config: {
                format: "YYYY-MM-DD HH:mm",
                pickDate: true,
                pickTime: true,
                useSeconds: false
            }
        }
    };
    

    VIEW:

    <ng-form name="meetingsEdit" ng-controller="meetings.edit.controller as vm" ng-show="loaded" ng-submit="save()" val-form-manager ng-model="meeting">
    <umb-panel>
        <umb-editor-view ng-if="loaded">
            <umb-editor-header name="meetingTitle(MeetingType.model.value, MeetingTitle)" name-locked="true" hide-icon="true" alias="formTitle" hide-alias="true" description="StartTime.model.value" description-locked="true">
            </umb-editor-header>
            <umb-editor-container>
                <h1 ng-show="meetingsEdit.$dirty==true">DIRTY</h1>
                <div class="umb-pane">
                    <umb-property property="StartTime.model">
                        <umb-editor model="StartTime.model" class="ng-pristine"></umb-editor>
                    </umb-property>
                </div>
            </umb-editor-container>
            <umb-editor-footer>
                <umb-editor-footer-content-right>
                    <a href="" class="btn btn-link" ng-click="close()"><localize key="general_cancel">Cancel</localize></a>
                    <umb-button type="submit"
                                button-style="success"
                                state="vm.page.saveButtonState"
                                shortcut="ctrl+s"
                                label="Save"
                                label-key="buttons_save">
                    </umb-button>
                </umb-editor-footer-content-right>
            </umb-editor-footer>
        </umb-editor-view>
    

  • Max 80 posts 437 karma points
    Nov 29, 2017 @ 15:14
    Max
    0

    made a change to \Umbraco\Js\umbraco.controllers.js:

    function dateTimePickerController: added the currForm.$setDirty()

    //handles the date changing via the api
        function applyDate(e) {
            // set form to dirty to tricker discard changes dialog
            var currForm = angularHelper.getCurrentForm($scope);
            currForm.$setDirty();
    
            angularHelper.safeApply($scope, function () {
                // when a date is changed, update the model
                if (e.date && e.date.isValid()) {
                    $scope.datePickerForm.datepicker.$setValidity('pickerError', true);
                    $scope.hasDatetimePickerValue = true;
    
                    $scope.datetimePickerValue = e.date.format($scope.model.config.format);
                } else {
                    $scope.hasDatetimePickerValue = false;
                    $scope.datetimePickerValue = null;
                }
                setModelValue();
                if (!$scope.model.config.pickTime) {
                    $element.find('div:first').datetimepicker('hide', 0);
                }
            });
        }
    

    Added currForm.$setDirty()

    $scope.clearDate = function () {
            $scope.hasDatetimePickerValue = false;
            $scope.datetimePickerValue = null;
            $scope.model.value = null;
            $scope.datePickerForm.datepicker.$setValidity('pickerError', true);
            // set form to dirty to tricker discard changes dialog
            var currForm = angularHelper.getCurrentForm($scope);
            currForm.$setDirty();
        };
    
  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies