Questions tagged [codemirror]

CodeMirror is an in-browser code editor, written in JavaScript. Among its notable features are syntax-highlighting, code-completion, auto-formatting and key-binding. The code-assist and highlighting capabilities are written as plugins called 'modes', and the editor supports many languages out of the box, but it can be extended to add support for any desired language.

CodeMirror is an in-browser code editor, written in JavaScript. Among its notable features are syntax-highlighting, code-completion, auto-formatting and key-binding. The code-assist and highlighting capabilities are written as plugins called 'modes', and the editor supports many languages out of the box, but it can be extended to add support for any desired language.

CodeMirror is widespread and used as the editor in the development tools for both Firefox and Chrome, Light Table, Adobe Brackets, Bitbucket, and many other projects.


Resources

1250 questions
88
votes
15 answers

Codemirror editor is not loading content until clicked

I am using codemirror 2 and its working fine except that the editor's set value doesn't load into the editor until I click the editor and it becomes focused. I want the editor to show the content of itself without it having to be clicked. Any…
Karl
  • 1,743
  • 1
  • 15
  • 20
86
votes
7 answers

How to get the value of Codemirror textarea

I am using Codemirror's plugin for textarea but I am not able to retrieve the value of textarea. Code: var editor = CodeMirror.fromTextArea(document.getElementById("code"), { lineNumbers: true, matchBrackets: true, mode: "text/x-csrc" …
Nitin Kabra
  • 3,146
  • 10
  • 43
  • 62
60
votes
7 answers

CodeMirror 2 - Highlight only (no editor)

Can CodeMirror 2 be used to highlight code from a DIV or PRE tag (without the editor)? Like CodeMirror 1 used to be able to do with the hightlightText() function? For example here: http://codemirror.net/1/highlight.html, after you press run…
Alex
  • 66,732
  • 177
  • 439
  • 641
50
votes
3 answers

React Hooks useState+useEffect+event gives stale state

I'm trying to use an event emitter with React useEffect and useState, but it always gets the initial state instead of the updated state. It works if I call the event handler directly, even with a setTimeout. If I pass the value to the useEffect()…
Tony R
  • 11,224
  • 23
  • 76
  • 101
44
votes
6 answers

How can I set the value of a CodeMirror editor using Javascript?

I try to set id4 in the following code:
By using this code: document.getElementById('id4').value = "..."; And…
Dmitry
  • 14,306
  • 23
  • 105
  • 189
35
votes
6 answers

Get CodeMirror instance

I want to get an instance of CodeMirror (it is binded to a textarea '#code'). From an onclick-event I want to add a value to the current value of the CodeMirror instance. How can this be achieved? From the docs I can't seem to find anything to get…
Ben Fransen
  • 10,884
  • 18
  • 76
  • 129
33
votes
8 answers

codemirror-textarea resizable like a standard textarea

Does anybody know how to make a codemirror textarea resizable like text-area ? So that the codemirror textarea can be resized by dragging their bottom down grabber corner. I know it's possible for html divs (see div resizable like text-area) but I…
Zo72
  • 14,593
  • 17
  • 71
  • 103
32
votes
3 answers

CodeMirror HTML mode not working

I'm trying to style code samples with CodeMirror, but it works partially - it applies the selected theme to the textarea but the syntax is not highlighted. There is my page: