data not loading in tinymce - Using Umbraco and getting started

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

Linx 98 posts 258 karma points

Nov 20, 2021 @ 13:50

Data not loading in TinyMCE?

Hi guys

I am using TinyMCE in a custom admin area with AngularJS.

                                <input value="{{vm.Details}}" />
                                <ng-form val-form-manager>
                                    <umb-property-editor model="rteDetails" ng-model="vm.Details" required="{{vm.Details}}"></umb-property-editor>
                                </ng-form>

And in my controllr

            $scope.rteDetails = {
                label: 'bodyText',
                description: 'Load some stuff here',
                view: "rte",
                value: vm.Details,
                config: {
                    editor: {
                        toolbar: ["ace", "undo", "redo", "bold", "italic", "alignleft", "aligncenter", "alignright", "bullist", "numlist", "link", "umbmediapicker", "fullscreen"],
                        style_formats: [{ title: "Heading 1", inline: "h1" }],
                        plugins: ["fullscreen"]
                    }
                }
            };

value: vm.Details, is coming from another function in the same Controller where it gets the data (and that data is being loaded in other controls) but i cant get it to show in TinyMCE.

Can anyone suggest why this is?

Also trying to set TinyMCE as required never works but using the same 'required' attribute works on other controls - why is this happening?

Thank you

Copy Link

Johannes Lantz 156 posts 839 karma points c-trib

Nov 20, 2021 @ 15:42

Hi!

I haven't test this on the RTE but for eg textboxes. You would set it to required by passing validation with mandatory equals to true. Something like this:

        $scope.rteDetails = {
            label: 'bodyText',
            description: 'Load some stuff here',
            view: "rte",
            value: vm.Details,
            config: {
                editor: {
                    toolbar: ["ace", "undo", "redo", "bold", "italic", "alignleft", "aligncenter", "alignright", "bullist", "numlist", "link", "umbmediapicker", "fullscreen"],
                    style_formats: [{ title: "Heading 1", inline: "h1" }],
                    plugins: ["fullscreen"]
                }
            },
            validation: {
                mandatory: true
            }
        };

I am bit unsure however why the RTE doesn't display the value. Do you get any errors in the console log? What happens if you pass in a static value? Dose it display the value then?

//Johannes

Copy Link

Linx 98 posts 258 karma points

Nov 20, 2021 @ 15:53

0

Hi Johannes Lantz

I will add the validation code your mentioned to see what it does.

As for the second question, yes if I hard code a value then yes it appears in TinyMCE editor window.

That's where I'm completely confused. Thank you

Oh and no errors in the console 🤔

Copy Link
David Tierney 1 post 71 karma points

Nov 22, 2021 @ 10:36

0

Hi,

Did you have a fix on this issue? Facing same issue but no response from anyone and couldn't find this topic troubleshooting anywhere.

MyBalanceNow

Copy Link
J 447 posts 864 karma points

Nov 22, 2021 @ 14:22
100
I came across this issue and this is what i did

For the line:
```
value: vm.Details,
```
in your RTE code above, you can remove it.

In your API calling code when you get the response, you would assign it as below
```
$scope.rteDetails.value = response.data["details"];
```
Or the equivalent code for your response.
Copy Link
is working on a reply...

Please Sign in or register to post replies