HTML div text to save and display

Question

The following is my editor code, when the user presses 'show editor text' button, the text in the div tag has to be saved and the same has to be displayed on the same page. How can I achieve this in HTML?

<!DOCTYPE html>
<html>
<head>
<title>ACE in Action</title>
<style type="text/css" media="screen">
    #editor { 
        position: absolute;
        top: 0;
        right: 0;
        bottom: 7%;
        left: 0;
    }
</style>
</head>
<body>

<div id="editor">
blah blah blah!
</div>

<script src="U:\hyd\code\JS\ace-builds-master\ace-builds-master\src-noconflict\ace.js"       type="text/javascript" charset="utf-8"></script>
<script>
    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/cobalt");
    editor.getSession().setMode("ace/mode/gc");
</script>


<button type= "button" style="position: absolute; left: 10%; bottom: 2%;" id="execute"  onclick="window.open('http://149.77.164.100:8180/FirstServlet/mygeco','_top','resizable=yes')">Click  to execute</button>

<button type= "button" style="position: absolute; left: 25%; bottom: 2%;" id="editortxt"     onclick="showstuff('editor');">Show editor text
</button>

</body>
</html>

----------------------------------EDIT---------------------------------

var edit = ace.edit("editor");
var code = edit.getSession().getValue();
window.open(code, _top);

added the above code, yet no output. I want to display the code on a new window, and then save it.

Define "saved". To echo the content back to the page, you can use javascript to get the contents from ace — helion3, Feb 13 '14 at 05:09
Yes, but how do I get contents of the div tag in on click? can you show me a code? — , Feb 13 '14 at 05:11
Second result in google my friend: http://stackoverflow.com/a/8976742/143269 — helion3, Feb 13 '14 at 05:13

score 0 · Accepted Answer · answered Feb 13 '14 at 05:35

Couldn't Understand the way your editor behave

Considering that you want to save the text on one button click & display the test latter on

add the below button to you html on click of this button your editor content would be saved in a variable and editor will be blank

    <input type='button' style="position: absolute; left: 20%; bottom: 2%;" id='save' value="Save"/>

Onclick of the below button the saved content would be displayed back

    <button type= "button" style="position: absolute; left: 25%; bottom: 2%;" id="editortxt"  >Show editor text
    </button>



    <script type='text/javascript'> 
     var StoreEditorContent;  //declare a variable to save Content

      document.getElementById('save').addEventListener("click", SaveText);  // adding event listner for onclick for Saving text

    function SaveText(){

       StoreEditorContent = document.getElementById('editor').innerHTML; // Save the Content into 
       document.getElementById('editor').innerHTML = ""; // to blank the editor Content

    }





      document.getElementById('editortxt').addEventListener("click", ShowText);  // adding event listner for onclick for Saving text

    function ShowText(){

       document.getElementById('editor').innerHTML = StoreEditorContent ; // Display  the Content into  editor

    }

    </script>

see the lower part, it contain an eventlistener for click of button with id="editortxt" , and on click of this button the content stored in the variable are displayed back to editor with id ="editor" — sanjeev, Feb 13 '14 at 05:50
10 down vote No. Browser-side javascript doesn't have permission to write to the client machine without a lot of security options having to be disabled — sanjeev, Feb 13 '14 at 06:30

HTML div text to save and display

1 Answers1

Linked