CODEWITHSUNDEEP
javascriptckeditor
RobG
RobG

Reputation: 592

CKEditor: Possible to invoke action by double-clicking on text inside editor?

I've googled and found nothing, so here I am. If this is in the CKEditor documentation, I haven't found it there either.

The powers that be want a user to be able to double-click on a piece of text (say, a word) in CKEditor, and have that be able to open up a new HTML element outside of CKEditor (such as a Bootstrap Modal). Is this even possible, and if so, how do I go about it?

For example, I've written a separate "Agenda Builder" which is really just where you pick some stuff from drop downs like the name of a meeting room, how many seats you'll need, etc, and enter some dates and times. That all gets saved to the database. But in the text in CKEditor, they want to be able to double-click on [[agenda]] and have it then open up that feature for the user to create their agenda and save it (an entirely separate thing from CKEditor), and then later I will "insert" the agenda into the document in place of the [[agenda]] tag. Make sense?

Thanks!

Upvotes: 0

Views: 500

Answers (2)

RobG
RobG

Reputation: 592

I think I manage to find the answers to these after posting the question... here's what I came up with:

editor.on('doubleclick', function(e) {
   var element = e.data.element.$.innerText;

   if (element =='[[agenda]]' ) {
      alert("clicked on agenda");
   }
});

Upvotes: 1

ttugates
ttugates

Reputation: 6271

We solved this exact scenario by creating a CKEditor Plugin(for our own use). When you highlight a word and select a drop down from the plugin, it edits the element highlighted.

In our scenario we used an Angular directive for the navigation.

Upvotes: 0

Related Questions