selectctize js не загружает параметры после изменения содержимого в редакторе tinyMCE - PullRequest
Новая
       32

selectctize js не загружает параметры после изменения содержимого в редакторе tinyMCE

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

Я прошу прощения, если вопрос сформулирован не очень разумно, я сам немного запутался в проблеме.

Я недавно начал работать с TinyMCE.

У меня есть раскрывающийся список, который вставляет FA 4 иконки с использованием их Unicode. Структура примерно такая: 

tinymce.init({
    selector: '#def',
    plugins: [
    "autolink advlist lists link anchor code hr textcolor image paste table"
    ],
    menubar: false,
    statusbar : false,
    toolbar: "styleselect removeformat bold italic underline | undo redo | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent hr fontawesome forecolor togglecase | link unlink table | code deletetext",
    setup: function(ed, cm, node) {

    ed.addButton("fontawesome", {
      title: "Insert Icon",
      icon: false,
      onclick: function() {
      $('body').addClass('hide-overflow');

      $('#fontawesome-icon-select').selectize({
        valueField: 'url',
        labelField: 'name',
        searchField: 'name',
        create: false,
        render: {
        option: function (item, escape) {
                  var icon;
                  icon = '<div class="selectable-icon">' + '<i value="' + item.url + '" style="display:inline-block;min-width:24px;" class="fa">&#x' + item.url + ';</i> <span>' + item.name + '</span></div>';

                  return icon;
                }
        }, //render ends
        onChange: function (name) {
        if (!name) {

        }
        else {

          tinymce.activeEditor.execCommand("mceInsertContent", false, '<i class="fa">&#x' + name + '</i>');

          $('#fontawesome-selectize-container').removeClass('show');
          $('body').removeClass('hide-overflow');

          setTimeout(function(){
          $('#fontawesome-icon-select').selectize()[0].selectize.clear();
          }, 300);
        }
        return false;
        } //onChange ends
      });

Я упустил некоторые дополнительные параметры TinyMCE, чтобы их было легче читать.

Выше все работало нормально, пока я не добавил функцию, которая заменяет определенный контент внутри редактора, используя другой раскрывающийся список. Как то так. 

document.getElementById("choice").onchange = function() {
  var get_choice = document.getElementById("choice").value;
  // get content in get active tinymce
  var content = tinymce.activeEditor.getContent({ format:'raw' });
  if(get_choice == 1){
    // replace "color" with "colour" for example 
    content = content.replace("color","colour");
  }
  else {
    // replace "colour" with "color" for example 
    content = content.replace("colour","color");
  }
  
  tinymce.activeEditor.setContent(content);
};

После запуска функции onchange раскрывающийся список выбора не будет загружать какие-либо параметры. Это просто ломается.

Я понятия не имею, в чем проблема. Может кто-нибудь помочь?

...