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