2

How to remove trigger character on autocomplete in tinyMCE? Let's assume that the trigger character is @. Once I select an autocomplete item, I wish to remove the preceding @ character.

1 Answers1

2

Here is an example of using the autocompleter and not including the trigger character:

https://fiddle.tiny.cloud/u7haab/12

The fetch function determines what is returned:

fetch: function (pattern) {
        return new tinymce.util.Promise(function (resolve) {
          var results = getMatchedNames(pattern).map(function (char) {
            return {
              type: 'autocompleteitem',
              value: char.value,     //This VALUE is what is inserted into the content via the onAction method
              text: char.value,
            }
          });
          resolve(results);
        });
}

...and the onAction method takes the value and inserts it into the editor:

var onAction = function (autocompleteApi, rng, value) { 
      editor.selection.setRng(rng);
      editor.insertContent(value);
      autocompleteApi.hide();
    };

Unless you explicitly choose to include the trigger character it won't be included if you follow this pattern.

Michael Fromin
  • 13,131
  • 2
  • 20
  • 31
  • Can we also ignore the trigger character altogether somehow? Like if I have an autocomplete list like ["apple","bananas"], then if I type character b, "bananas" autocomplete option should popup, and likewise for "apple" with character a? – Rakshit Kumar Jul 14 '21 at 18:57
  • To answer your follow up question - no. The autocompleter requires a trigger character. – Michael Fromin Jul 14 '21 at 20:21
  • Receiving error: ``` Argument of type '{ type: string; value: string; text: string; }[]' is not assignable to parameter of type 'AutocompleterContents[] | PromiseLike'.``` on resolve(results) line. – Rakshit Kumar Jul 14 '21 at 23:17
  • I get no such error running the Fiddle - what browser are you using when you run the fiddle I provided? – Michael Fromin Jul 15 '21 at 00:34
  • I'm using angular and this error is a compile time error – Rakshit Kumar Jul 16 '21 at 07:27