How to trigger Quill JS's Mention Module when a button is clicked

Viewed 954

I'm using this quill mention module for my quill editor: https://github.com/afry/quill-mention.

My editor toolbar has an "@" button, and I was hoping that what if I click that the mention-list will appear.

Was thinking my code will be something like this:

$("button.mention-btn").on("click", triggerMention);

function triggerMention(){
  if(!quill.hasFocus()){
    quill.focus();
  }

  evt1 = $.Event('keydown');
  evt1.which = 16; // shift
  evt2 = $.Event('keypress');
  evt2.which = 50; // 2

  quill.trigger(evt1);
  quil.trgger(evt2);

}

Can someone with quill-js experience please help. Thanks in advance.

1 Answers

As stated in the docs, the method openMenu(denotationChar):

Opens the mentions menu for the given denotation character.

In order to call this method, we need to retrieve the module from Quill like: quill.getModule('mention').

The following code should work:

function showMenu() {
  quillEditor.getModule("mention").openMenu("@");
}

Codepen: https://codepen.io/andreivictor/pen/yLbjPaQ

Related