передача текста из div в текстовый редактор TinyMCE и передача обратно в div - PullRequest
0 голосов
/ 04 октября 2019

enter image description here

HTML, чтобы загрузить текст из div ниже и отредактировать его с помощью редактора TinyMCE во всплывающем модуле и обновить текст после нажатия кнопки сохранения. Я попробовал код ниже, ноэто не сработало.

<div class="sim-row-header1-slider-left-text sim-row-edit" data-type="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae ullamcorper orci. Nullam nulla felis, imperdiet ac sollicitudin et, malesuada sagittis lacus.</div>

HTML Popup модуль для редактирования текста с помощью текстового редактора

<div class="sim-edit" id="sim-edit-text">
<div class="sim-edit-box" style="height:390px;">
<div class="sim-edit-box-title">Edit Text</div>

<div class="sim-edit-box-content">
<div class="sim-edit-box-content-text">Text</div>
<div class="sim-edit-box-content-field"><textarea class="sim-edit-box-content-field-textarea text text-editor"></textarea></div>
</div>
<div class="sim-edit-box-buttons">
<div class="sim-edit-box-buttons-save">Save</div>
<div class="sim-edit-box-buttons-cancel">Cancel</div>
</div>
</div>
</div>

JavaScript для передачи данных в текстовый редактор и передачи их обратно, когда кнопка сохранениянажал.

tinymce.init({
    selector: ".text-editor",
    width:      '100%',
    height:     270,
    plugins:    [ "anchor link" ],
    statusbar:  false,
    menubar:    false,
    toolbar:    "link anchor | alignleft aligncenter alignright alignjustify",
    rel_list:   [ { title: 'Lightbox', value: 'lightbox' } ]
});

//edit text
if(big_parent.attr("data-type")=='text'){

$("#sim-edit-text .text").val(big_parent.text());
$("#sim-edit-text").fadeIn(500);
$("#sim-edit-text .sim-edit-box").slideDown(500);

$("#sim-edit-text .sim-edit-box-buttons-save").click(function() {
  $(this).parent().parent().parent().fadeOut(500)
  $(this).parent().parent().slideUp(500)

    big_parent.text($("#sim-edit-text .text").val());



    });

}

1 Ответ

0 голосов
/ 04 октября 2019

Как только TinyMCE загружается на страницу, базовая textarea больше не видна на странице. Когда вы печатаете в TinyMCE, вы на самом деле не обновляете textarea, а скорее вводите в iFrame.

Прежде чем пытаться использовать JavaScript для взаимодействия с textarea, вы должны вызвать triggerSave(), чтобы TinyMCE обновил базовый textarea текущим содержимым редактора. В качестве альтернативы вы можете получить контент TinyMCE через getContent() API (https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/#getcontent).

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