Refresh Editor

[ghost]

Hi,

I would like to be able to refresh the editor (re-initialize it).

I am setting the css for my editor has below private Dictionary<string, object> edEmailBodyConf { get; set; }

code to setup the editor default CSS from OnInitializedAsync method edEmailBodyConf = new Dictionary<string, object> { { "plugins", "code" }, { "content_style", _bodyStyle }, { "height", 450 } };

My razor code <Editor Id="eEditor" @bind-Value="BodyText" ApiKey="msdkhjdkjdfghksfhdfgk3656sdf56sdfsdf1" Conf="@edEmailBodyConf" />

I have a drop down that set edEmailBodyConf with the new css (_bodyStyle ), but the editor is not getting refreshed.

Is there a way of refreshing the editor?

[exalate-issue-sync[bot]]

Ref: INT-2692

[jscasca]

@VinnyJo

Once the editor has been initialised there is no way to change the configuration. However, there are multiple ways to get around that. The easiest way is to have a dynamic list of components to display so that the editor is created dynamically. For example:

<div>
@foreach(Editor Editor in Editors){
  <TinyMCE.Blazor.Editor @bind-Value="BodyText" @key="Editor" Conf=@Editor.Conf />
}
</div>
...
@code {
  Class Editor {...}
  List<Editor> Editors = new List<Editor>(){
    new Editor(){Conf=new Dictionary<string, object>{{"content_style",_selectedStyle}};
  }
  void UpdateEditor() {
    editors.RemoveAt(0);
    editor.Add(new Editor(){Conf=new Dictionary<string, object>{{"content_style", _selectedStyle}}});
  }
}

If you have a drop down it probably means that the options for configurations are limited and you can just select from those options instead of dynamically creating new ones.

Let me know if this helps

[ghost]

Hi @jscasca,

Thank you for the sample, it works fine.

Regards,

Vincent

From: jscasca @.> Sent: 16 November 2021 08:06 To: tinymce/tinymce-blazor @.> Cc: Vincent Jourdain @.>; Mention @.> Subject: Re: [tinymce/tinymce-blazor] Refresh Editor (Issue #28)

@VinnyJohttps://github.com/VinnyJo

Once the editor has been initialised there is no way to change the configuration. However, there are multiple ways to get around that. The easiest way is to have a dynamic list of components to display so that the editor is created dynamically. For example:

@foreach(Editor Editor in Editors){ /> }

...

@code {

Class Editor {...}

List Editors = new List(){

new Editor(){Conf=new Dictionary<string, object>{{"content_style",_selectedStyle}};

}

void UpdateEditor() {

editors.RemoveAt(0);

editor.Add(new Editor(){Conf=new Dictionary<string, object>{{"content_style", _selectedStyle}}});

}

}

If you have a drop down it probably means that the options for configurations are limited and you can just select from those options instead of dynamically creating new ones.

Let me know if this helps

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/tinymce/tinymce-blazor/issues/28#issuecomment-969986664, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AUVDHJJQ7TOYGOLKAFKQYEDUMIGHTANCNFSM5HYDBX4Q. Triage notifications on the go with GitHub Mobile for iOShttps://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Androidhttps://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

[jscasca]

Glad you got it working!