How to enable right click inside RTE? | Community
Skip to main content
Community Advisor
December 6, 2023
Solved

How to enable right click inside RTE?

  • December 6, 2023
  • 4 replies
  • 1419 views

Currently RTE spellcheck plugin doesn't provide spelling suggestions so we want to utilize browser's default spellcheck functionality. For that we need a right click inside RTE to work but its disabled.

Does anyone know how can we enable right click inside RTE?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by salamswapnil

Hi @kautuk_sahni 

Yes, I managed to find a solution.

RTE clientlib extends CUI.rte.ui.ContextMenuBuilder class with name CUI.rte.ui.cui.CuiContextMenuBuilder which has overridden function build(). This function causes to not load context menu (menu that loads on right click).

I created a custom clientlib and extended the same class and override the build() function to return true instead for 'undefined' as below.

/* global Class: true */ /* jshint strict: false */ (function ($, CUI) { //'use strict'; CUI.rte.ui.cui.CuiContextMenuBuilder = new Class({ toString: 'CuiContextMenuBuilder', extend: CUI.rte.ui.ContextMenuBuilder, construct: function (editorKernel) { // TODO ...? }, build: function (selectionContext, context) { // returning undefined means that we don't use a context menu return true; }, createItem: function (config) { return new CUI.rte.ui.cui.CmItemImpl(config); }, createSeparator: function () { return new CUI.rte.ui.cui.CmSeparatorImpl(); }, showAt: function (x, y) { // TODO ...? }, hideAll: function () { // TODO ...? }, isVisible: function () { return false; } });

 This fixed the issue.

4 replies

Shashi_Mulugu
Community Advisor
Community Advisor
December 7, 2023

@salamswapnil I don't think it I'd possible.. think of how to enable spell check feature within RTE or use AI for it.

Harwinder-singh
Community Advisor
Community Advisor
December 7, 2023

@salamswapnil set contenteditable attribute to false and that should allow you to right click into the text area. You will have to find a way to override this attribute value as with RTE default is true. 

 

 

Community Advisor
December 7, 2023

Hi @harwinder-singh

Thank you for your reply..!!

 If we set contenteditable="false", it makes RTE uneditable and that's a big problem.

Harwinder-singh
Community Advisor
Community Advisor
December 7, 2023

@salamswapnil Unfortunately, there isn't any other way out here to enable this without affecting the edit behavior of RTE.

Community Advisor
December 7, 2023

Hi @arunpatidar 

Thank you for the reply..!!

The problem with RTE spellcheck plugin is that it just highlights the incorrect spellings but doesn't provide alternative spelling suggestions.

That's why we are trying to utilize browser's default spellcheck functionality and for that we need a right click inside RTE to work but its disabled.

kautuk_sahni
Community Manager
Community Manager
December 11, 2023

@salamswapnil Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

Kautuk Sahni
salamswapnilCommunity AdvisorAuthorAccepted solution
Community Advisor
December 11, 2023

Hi @kautuk_sahni 

Yes, I managed to find a solution.

RTE clientlib extends CUI.rte.ui.ContextMenuBuilder class with name CUI.rte.ui.cui.CuiContextMenuBuilder which has overridden function build(). This function causes to not load context menu (menu that loads on right click).

I created a custom clientlib and extended the same class and override the build() function to return true instead for 'undefined' as below.

/* global Class: true */ /* jshint strict: false */ (function ($, CUI) { //'use strict'; CUI.rte.ui.cui.CuiContextMenuBuilder = new Class({ toString: 'CuiContextMenuBuilder', extend: CUI.rte.ui.ContextMenuBuilder, construct: function (editorKernel) { // TODO ...? }, build: function (selectionContext, context) { // returning undefined means that we don't use a context menu return true; }, createItem: function (config) { return new CUI.rte.ui.cui.CmItemImpl(config); }, createSeparator: function () { return new CUI.rte.ui.cui.CmSeparatorImpl(); }, showAt: function (x, y) { // TODO ...? }, hideAll: function () { // TODO ...? }, isVisible: function () { return false; } });

 This fixed the issue.