Как взять содержимое редактора кода Ace с формой laravel - PullRequest
3 голосов
/ 29 мая 2020

как говорится в вопросе, я хочу отправить код из редактора, но я не знаю, как это сделать, используя форму laravel. Я обнаружил, что могу использовать editor.getValue() здесь , но не знаю, как использовать его с laravel. У меня такой код


<style type="text/css" media="screen">
    #editor {
        position: absolute;
        top: 150px;
        right: 150px;
        bottom: 150px;
        left: 150px;
    }
    .ace_editor {
        border: 1px solid lightgray;
        margin: auto;
        height: 65%;
        width: 55%;
    }
    .scrollmargin {
        height: 80px;
        text-align: center;
    }
</style>

{!! Form::open(['action' => 'ProblemsController@store']) !!}
  <div id="editor">
    //Your code goes here
  </div>
  {{Form::submit('Submit')}}
  <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.3.3/ace.js" type="text/javascript" charset="utf-8"></script>
  <script>
      var editor = ace.edit("editor");
      editor.setTheme("ace/theme/chrome");
      editor.session.setMode("ace/mode/c_cpp");
  </script>
{!! Form::close() !!}

Ответы [ 2 ]

1 голос
/ 29 мая 2020

Вы можете добавить скрытый ввод и заполнить его editor.getValue() в методе onchange. примерно так:

Javascript

editor.session.on('change', function(delta) {
   var content=document.getElementById('hiddenInput');
   content.value=editor.getValue()
});

HTML

 <input name="hiddenInput" id="hiddenInput">
1 голос
/ 29 мая 2020

Вы можете использовать событие сеанса change для обновления скрытого текстового поля содержимым редактора Ace (следующий непроверенный код):

JavaScript:

const $formElement = $('.js-ace-code');

editor.getSession().on('change', function () {
    $formElement.val(editor.getSession().getValue());
});

Добавьте дополнительное текстовое поле к желаемой форме, в которой находится редактор Ace:

<form>
    <textarea name="code" class="js-ace-code" style="display: none;"></textarea>
</form>

По-видимому, также есть метод, в котором вы можете добавить кнопку с триггером в обновить код с помощью запроса AJAX.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...