Содержимое Multiple Ace Editor возвращает только одну строку - PullRequest
Новая
       8

Содержимое Multiple Ace Editor возвращает только одну строку

0 голосов
/ 26 мая 2019

Я внедрил два редактора ACE на своей странице. Первый редактор: 

$('#custom_css').val(custom_css_editor.getSession().getValue());

возвращает все коды, которые я набрал, но, к сожалению, другой редактор: 

$('#custom_script').val(custom_js_editor.getSession().getValue());

возвращает только одну строку. Как вы думаете, в чем причина такого сбоя?

Вот что я хочу показать:

multiple ACE editors

Вот коды, которые у меня есть: 

var custom_css_editor = ace.edit("custom_css_editor", {
  theme: "ace/theme/twilight",
  mode: "ace/mode/css",
  maxLines: 10
});
var custom_js_editor = ace.edit("custom_js_editor", {
  theme: "ace/theme/twilight",
  mode: "ace/mode/javascript",
  maxLines: 10
});

document.querySelector('#custom_css_editor .ace_text-input')
  .setAttribute('name', 'custom_css');
document.querySelector('#custom_css_editor .ace_text-input')
  .setAttribute('id', 'custom_css');
document.querySelector('#custom_js_editor .ace_text-input')
  .setAttribute('name', 'custom_script');
document.querySelector('#custom_js_editor .ace_text-input')
  .setAttribute('id', 'custom_script');
  
custom_css_editor.session.on('change', function() {
  $('#custom_css').val(custom_css_editor.getValue());
});
$('#custom_css').val(custom_css_editor.session.getValue());
custom_js_editor.getSession().on('change', function() {
  $('#custom_script').val(custom_js_editor.getValue());
});
$('#custom_script').val(custom_js_editor.session.getValue());
<div class="form-group">
  <label class="lbl-input" for="custom_css">Custom CSS</label>
  <div id="custom_css_editor"></div>
</div>
<div class="form-group">
  <label class="lbl-input" for="custom_script">Custom Scripts</label>
  <div id="custom_js_editor"></div>
</div>

<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.4/ace.js"></script>

Ответы [ 2 ]

0 голосов
/ 27 мая 2019

Хорошо, мне нужно добавить <input type="hidden" id="custom_css" value="" /> и custom_script" value="" />, чтобы отобразить полное содержимое редакторов css и js, как по волшебству это работает!

0 голосов
/ 27 мая 2019

Это происходит потому, что вы изменяете значение textarea .ace_text-input. Изменение dom внутри редактора обычно ломает его.

...