How-to select & copy code from codemirror editor with button

I will be share with you how to select code in editor and copy it using javascript Method [ focus() ,execCommand("selectAll"), execCommand("copy") ]

  <link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">
<link rel="stylesheet" href="https://codemirror.net/doc/docs.css">
<script src="https://codemirror.net/lib/codemirror.js"></script>
<script src="https://codemirror.net/mode/css/css.js"></script>
<script src="https://codemirror.net/mode/xml/xml.js"></script>
  <script src="https://codemirror.net/mode/javascript/javascript.js"></script>
  <script src="https://codemirror.net/mode/css/css.js"></script>
  <script src="https://codemirror.net/mode/htmlmixed/htmlmixed.js"></script>
<input type="file" onchange="localLoad(this.files);" />


<div class="editor"> </div>



<script>
   var myCodeMirror = CodeMirror(
   document.getElementsByClassName('editor')[0], {
     mode: "text/html",
	value:"<p>mami</p>"
    
   });
var dd=document.createElement("button");
  dd.innerHTML = "copy"; 
  dd.style="position: absolute; top: 0; right: 0;"
  dd.onclick = function(){
   myCodeMirror.focus();
  myCodeMirror.execCommand("selectAll");   ;
document.execCommand("copy");                                                
};
document.getElementsByClassName("editor")[0].appendChild(dd);
  
   function localLoad(files) {
       if (files.length == 1) {
            document.title = escape(files[0].name);
            var reader = new FileReader();
            reader.onload = function(e) {
              myCodeMirror.setValue(e.target.result);
            };
            reader.readAsText(files[0]);
         }
    }
</script>

How-to select & copy code from codemirror editor with button

☷✎

How-to select & copy code from codemirror editor with button

Comments

Post a Comment

Meta keywords generator tool for Blogger

Custom permalink creator for blogger

Create direct download link for google drive file online

blogger meta description generator

Create simple recent post with thumbnail in blogger

How-to select & copy code from codemirror editor with button

Related

Comments

Post a Comment