Using codemirror with jquery.ui.dialog - Javascript CodeMirror

Javascript examples for CodeMirror:Configuration

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

Description

Using codemirror with jquery.ui.dialog

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=( function() {/*from   ww w  . java2s.  c o  m*/
    $(function() {
        $( ".dialog" ).dialog({
            autoOpen: false,
            show: "blind",
            hide: "explode"
        });
       $( ".opener" ).click(function() {
            $( ".dialog" ).dialog( "open" );
            setTimeout(function(){editor.refresh();}, 20);
            return false;
        });
    });
var editor = CodeMirror.fromTextArea(document.getElementById("mod_name_e"),
{mode: "javascript",
lineNumbers: true,
matchBrackets: true,
theme: "default"
  });
    });

      </script> 
   </head> 
   <body> 
      <link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css"> 
      <script src="https://codemirror.net/lib/codemirror.js"></script> 
      <script src="https://codemirror.net/mode/javascript/javascript.js"></script> 
      <link rel="stylesheet" href="https://codemirror.net/mode/javascript/javascript.css"> 
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
      <link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet"> 
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script> 
      <a href="#" class="opener">mod_name</a>
      <br> 
      <div class="dialog" style="" id="mod_name"> 
         <textarea id="mod_name_e" name="mod_name_e">
function getCompletions(token, context) {
  var found = [], start = token.string;
  function maybeAdd(str) {
    if (str.indexOf(start) == 0) found.push(str);
  }
</textarea> 
      </div>  
   </body>
</html>

Related Tutorials