Как я могу получить содержимое внутри Ace (редактор кода) после нажатия кнопки? - PullRequest
Новая
       37

Как я могу получить содержимое внутри Ace (редактор кода) после нажатия кнопки?

0 голосов
/ 08 апреля 2020

У меня есть страница со встроенным редактором кода Ace, который будет содержать Java код. Я хочу получить его содержимое через запрос POST после нажатия кнопки.

Я знаю, что это можно сделать, чтобы получить значение: 

var code = editor.getValue();

Однако я не слишком уверен, как бы получить это значение из моего обработчика маршрута. В идеале мне бы хотелось, чтобы скрипт редактора находился в отдельном файле. js, но я никак не могу его распознать.

В моем руле шаблон для / myroute / *

<div class = "bigclass">

    some divs 

    <div id = "containerclass">
        <div id = "editor"></div>
        <script src = "https://pagecdn.io/lib/ace/1.4.8/ace.js", type = "text/javascript" charset = "utf-8"></script>
        <script>
            var editor = ace.edit("editor");
            editor.setTheme("ace/theme/github");
            editor.session.setMode("ace/mode/java");
            editor.session.setUseWrapMode(true);
            editor.setValue("Hello"); 
            editor.clearSelection();
        </script>
    </div>

    some more divs 

    <div id = "someotherclass"> 
        <form method = "POST" action = ""> 
            <button style = "text-align: center" type="submit" class="btn"> Submit</button>
        </form>
    </div>
</div>

Обработчик маршрута для / myroute / *

app.post('/myroute/*', function(req, res) {
    // Get the contents of the editor 
});

1 Ответ

0 голосов
/ 08 апреля 2020

Вы должны задать ввод внутри формы и заполнять его каждый раз, когда в редакторе вносятся изменения.

При нажатии кнопки "Отправить" вы можете получить значение из req.body

<div class = "bigclass">

    some divs 

    <div id = "containerclass">
        <div id = "editor"></div>
        <script src = "https://pagecdn.io/lib/ace/1.4.8/ace.js", type = "text/javascript" charset = "utf-8"></script>

    </div>

    some more divs 

    <div id = "someotherclass"> 
        <form method = "POST" action = ""> 
            <textarea name="content" id="content"></textarea>
            <button style = "text-align: center" type="submit" class="btn"> Submit</button>
        </form>
    </div>
</div>

        <script>
            var editor = ace.edit("editor");
            editor.setTheme("ace/theme/github");
            editor.session.setMode("ace/mode/java");
            editor.session.setUseWrapMode(true);
           editor.getSession().on("change", function () {                
                document.getElementById('content').val(editor.getSession().getValue());
           });
            editor.setValue("Hello"); 
            editor.clearSelection();
        </script>

Сервер: 

app.post('/myroute/*', function(req, res) {
    const content = req.body.content; 
});
...