I am developing website which having xml, java programs. So i chose CodeMirror for displaying programs in TextArea. I had successfully displayed. It's default height is 300px in codemirror.css. How to change Height and Width of TextArea programmatically in codemirror? 
Set Codemirror height based upon button click/window resize This can be achieved with the help of setSize function which is present in Codemirror Component.
Once you import CodeMirror via <script> tag, you get a CodeMirror global that you can use to create a new CodeMirror instance. Just point it at a <div> and CodeMirror does the rest. CodeMirror(document. querySelector('#my-div'), { lineNumbers: true, tabSize: 2, value: 'console.
If you don't want to kill the CodeMirror instance, just change the entire document holding the text, data on markers etc. This can be done by calling cm. swapDoc(doc: CodeMirror. Doc) .
The CodeMirror user manual is your friend.
Example code:
<textarea id="myText" rows="4" cols="10"></textarea>  <script type="text/javascript" language="javascript">     var myTextArea = document.getElementById('myText');     var myCodeMirror = CodeMirror.fromTextArea(myTextArea);     myCodeMirror.setSize(500, 300); </script> 
                        If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With