Ace Editor in PHP Web App

Question

I am making a small web app that allows users to submit html, css and javascript content via Ace Editor. In this editor, echoing stored content into the editor is simply enough however I cannot find anyway to submit a users input to the database. I can see there is a textarea generated by the JavaScript however I'm not exactly sure what it is doing, how to get to it or if I should be looking for something else entirely.

I'm primarily looking for a field or something that I can use to have php submit into the db.

Answer 1

The contents of the edit window are available with the session getValue method. For example, here is an extension to the standard ACE demo for save file:

saveFile = function() {
    var contents = env.editor.getSession().getValue();

    $.post("write.php", 
            {contents: contents },
            function() {
                    // add error checking
                    alert('successful save');
            }
    );
};

I added the saveFile call to the already existing "Fake Save" that is in demo.js. I replace the alert with code like this:

// Fake-Save, works from the editor and the command line.
canon.addCommand({
    name: "save",
    bindKey: {
        win: "Ctrl-S",
        mac: "Command-S",
        sender: "editor|cli"
    },
    exec: function() {
        saveFile();
    }
});

The php file is just one line:

$r = file_put_contents("foo.txt", $_POST["contents"]) or die("can't open file");