This sample demonstrates the different mentioned characters that are used to render the suggestion list. Type the @
or #
or $
or %
characters to select or tag the name from respective suggestion lists.
The requireLeadingSpace
property in Mention controls whether a space is needed before triggering the
Mention suggestion popup.
When set to false
, it activates without a space; when set to true
, a space is required
before the Mention character. To see this feature in action, start typing with #
.
In the above sample, the following are configured for the contenteditable div element with @mention integrated.
@
- Typing @
lists out the suggestions of the employee names.#
- Typing #
lists the project names.$
- Typing $
lists out the cost of the project.%
- Typing %
lists the status of the project.