Apply Codemirror to multiple textarea by classes - Javascript CodeMirror

Javascript examples for CodeMirror:Configuration

  1. HOME
  2. Javascript
  3. CodeMirror
  4. Configuration

Description

Apply Codemirror to multiple textarea by classes

Demo Code

ResultView the demo in separate window 

<html lang="en">
   <head> 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/codemirror.min.css"> 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/theme/neat.css"> 
   </head> 
   <body translate="no"> 
      <textarea class="textarea-class"></textarea> 
      <textarea class="textarea-class"></textarea> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/codemirror.min.js"></script> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/javascript/javascript.min.js"></script> 
      <script>
      var textareas = document.querySelectorAll(".textarea-class");
for (var i = 0; i < textareas.length; i++) {
  CodeMirror.fromTextArea(textareas[i], {
    lineWrapping: true,//ww w .  j  av  a 2 s.  co m
    mode: "javascript",
    theme: "neat",
    lineNumbers: true
  });
}
   
      </script>  
   </body>
</html>

Related Tutorials