Copied to clipboard

Flag this post as spam?

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


  • Thomas 315 posts 602 karma points c-trib
    Sep 29, 2020 @ 08:52
    Thomas
    0

    Custom section - reuse rte - set no -dirty to model

    Hey

    I have some trouble in a custom section that I have build.

    I'm reusing to rte from Umbraco with this.

    <umb-property-editor model="rte" no-dirty-check></umb-property-editor>
    <a class="btn btn-primary" ng-click="saveComment()">Save</a>
    
    $scope.rte = {
        view: 'rte',
        value: "",
        config: {
            editor: {
                toolbar: ["code", "undo", "redo", "bold", "italic", "bullist"]
            }
        }
    };
    

    And that gives me

    enter image description here

    When I type in text I would like to prevent the "do you wanna save your changes" modal that pops up when an editor leaves the page..

    enter image description here

    I have tried with "no-dirty" on the umb-property-editor put that didn't do the trick... Is there away to get that ?

  • Thomas 315 posts 602 karma points c-trib
    Sep 30, 2020 @ 20:16
    Thomas
    0

    Anyone ??

  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Sep 30, 2020 @ 20:54
    Marc Goodson
    0

    Hi Thomas

    Is it

    no-dirty-check
    

    that you are after?

    instead of

    no-dirty
    

    ??

    regards

    Marc

  • Thomas 315 posts 602 karma points c-trib
    Sep 30, 2020 @ 20:58
    Thomas
    0

    Mistyping... did use no-dirty-check... :)

    Still not working, asking for the editor to save changes

  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Oct 01, 2020 @ 06:05
    Marc Goodson
    0

    Sorry Thomas

    was just skimming :-( and noticed the difference in the title, apologies.

    no-dirty-check directive will work if you place it on the actual

    I'm not super sure if you are using the umb property editor directive wrapper around the rte property editor how you would do that - I can't see a way in the source code of applying a similar rule to prevent dirtyness from being checked.

    https://github.com/umbraco/Umbraco-CMS/blob/5ce9a3e74f3b8470430298db5f00e4212b95619e/src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbpropertyeditor.directive.js

    I did see this forum post

    https://our.umbraco.com/forum/umbraco-8/98277-how-to-stop-you-have-unsaved-changes-message

    and the suggestion to set the form as being pristine when it's saved?

    regards

    Marc

  • Thomas 315 posts 602 karma points c-trib
    Oct 01, 2020 @ 06:59
    Thomas
    0

    Thanks for your reply :)

    I have tried

    var currForm = angularHelper.getCurrentForm($scope);
    currForm.$setPristine();
    

    but currForm are alway null...

  • Thomas 315 posts 602 karma points c-trib
    Oct 01, 2020 @ 07:27
    Thomas
    0

    I could just save the node when then post a comment.

    with this:

    contentResource.getById(editorState.current.id)
            .then(function (content) {
                console.log(content)
                contentResource.save(content, false, [], true)
                    .then(function (node) {
                        alert("Retrieved, updated and saved again");
                    });
            });
    

    But getting this error:

    {"errorMsg":"An error occurred","data":{"Message":"No variants flagged for saving"},"status":404}
    
  • Thomas 315 posts 602 karma points c-trib
    Oct 01, 2020 @ 07:37
    Thomas
    0

    Need to add content.variants[0].save = true;

  • Thomas 315 posts 602 karma points c-trib
    Oct 01, 2020 @ 07:38
    Thomas
    0

    Hmm but the Unsaved changes modal are still coming. But the page saved succesfully.. strange...

  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Oct 01, 2020 @ 07:58
    Marc Goodson
    0

    The Unsaved changes modal only appears if the form is 'dirty'...

    if you are working in a custom dashboard, then saving the item won't know to mark your form undirty

    if you look in dev tools, you'll see the dirty class appear on your form entry when you start editing in the field, and see that it remains even when you save.

    setPristine(); is probably the correct thing to do here

    but it's getting a reference to your dashboard form that appears to be the challenge!

    There is an example from a post, referenced from the other forum post:

    var contentForm = angular.element('form[name=contentForm]').scope().contentForm;
    

    would that approach get you your form and allow you to call setPristine(); ?

    regards

    Marc

  • Thomas 315 posts 602 karma points c-trib
    Oct 01, 2020 @ 08:51
    Thomas
    0

    I can see the form gets the class ng-dirty :)

    Yes can't catch the form...

    This

    var contentForm = angular.element('form[name=contentForm]').scope().contentForm;
    

    is just giving med this.. Cannot read property 'contentForm' of undefined

    Gives me Undefined...
    angular.element('form[name=commentForm]').scope()
    
  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Oct 01, 2020 @ 18:59
    Marc Goodson
    0

    Yes it will need to be the name of your form? presume that is commentForm?

    https://docs.angularjs.org/api/ng/function/angular.element

    but I'm not sure why it's not finding it or if it is finding it, why .scope is undefined... frustrating because I reckon calling setPristine would get rid of the ng-dirty css class and then the un saved changes dialog wouldn't be triggered...

  • Thomas 315 posts 602 karma points c-trib
    Oct 02, 2020 @ 07:02
    Thomas
    0

    Can get the element with angular.element('ng-form[name=commentForm]') but the .scope() still gives an undefined...

Please Sign in or register to post replies

Write your reply to:

Draft