insert and display complex data


My use case is the following: as soon as the user types some special formatted string (it could come from a suggestion list as well), I’d like to convert it into a readable format. Structured data, though, should still be available for an eventual tooltip or be filled in before passing the text to the server.

Example: user types apple#2543 where 2543 is the id of the synonym set (synset). Editor should show it as apple using a styled . If mouse over, the id and further data should show up. Also when I get the content before sending it to the server, I would like to get food#2543 (or be able to rebuild that form).

Is this possible with CodeMirror?


Yes, see markText, specifically the replacedWith option.


Thanks, it’s perfect.

It’s amazing seeing how many things you can do with CodeMirror :slight_smile: