How do I get value from ACE editor?

Per their API:

Markup:

<div id="aceEditor" style="height: 500px; width: 500px">some text</div>

Finding an instance:

var editor = ace.edit("aceEditor");

Getting/Setting Values:

var code = editor.getValue();

editor.setValue("new code here");

Based on my experience, Ace is the best code editor I've seen. There are few others such as CodeMirror etc. but I found them to be less useful or difficult to integrate than Ace.

Here's a Wiki page for comparision of such editors.

There is a paid one also which I haven't tried (and I can't remember for now). Will updated later if I can find it.

I solve this problem with an hidden input :)

    <input type="hidden" name="komutdosyasi" style="display: none;">
    <script src="/lib/aceeditor/src-min/ace.js" type="text/javascript" charset="utf-8"></script>

<script>
    var editor = ace.edit('editor');
        editor.session.setMode("ace/mode/batchfile");
        editor.setTheme("ace/theme/monokai");

    var input = $('input[name="komutdosyasi"]');
        editor.getSession().on("change", function () {
        input.val(editor.getSession().getValue());
    });
</script>   

To save the contents of the editor I placed a hidden input immediately before it, and initialized the editor like so:

    var $editor = $('#editor');
    if ($editor.length > 0) {
        var editor = ace.edit('editor');
        editor.session.setMode("ace/mode/css");
        $editor.closest('form').submit(function() {
            var code = editor.getValue();
            $editor.prev('input[type=hidden]').val(code);                
        });
    }

When my form is submitted we get the editor value and copy it to the hidden input.