TinyMce с Facebox - PullRequest
Новая
       22

TinyMce с Facebox

2 голосов
/ 23 марта 2012

У меня возникла проблема с использованием tinymce в текстовом поле внутри модального всплывающего окна Facebox. Я пытаюсь сделать что-то вроде следующего:

  • Есть родительская страница, на которой я загружаю файл tinymce.min.js javascript, а также делаю tinyMCE.init().
  • На родительской странице есть кнопка, и по ее нажатию я вызываю функцию javascript, которая выполняет вызов ajax и отображает html возврата из вызова ajax в facebox.
  • В ответном HTML-коде от вызова ajax есть текстовое поле, которое должно быть крошечным MCEd.
  • У меня есть зарегистрированный обработчик события, который связан с событием afterReveal.facebox - который из документации выглядит так, как будто он вызывается после рендеринга facebox (хотя документ не очень понятен)

  • В приведенном выше обработчике событий у меня есть следующий код -

    tinyMCE.execCommand ('mceAddControl', true, 'new-outline')

new-outline - это идентификатор текстовой области, которая должна быть tinyMCEd.

Я не получаю никаких ошибок JS, и текстовая область становится редактором tinymce. Однако редактор выпрыгивает из окна (справа), и видна только часть редактора.

Если я не сделаю это крошечным mce, тогда текстовое поле будет правильно отображено внутри лицевой панели.

Как я могу это исправить?

Ответы [ 3 ]

2 голосов
/ 23 марта 2012

Я столкнулся с проблемой из-за некоторых стилей в моем CSS.Метод, который я описал, является лучшим способом достижения этого, если вы хотите сделать что-то подобное.

0 голосов
/ 20 августа 2013

Убедитесь, что в вашем facebox.js

указана следующая строка 
reveal: function(data, klass) {
      $(document).trigger('beforeReveal.facebox')
      if (klass) $('#facebox .content').addClass(klass)
      $('#facebox .content').empty().append(data)
      $('#facebox .popup').children().fadeIn('normal')
      $('#facebox').css('left', $(window).width() / 2 - ($('#facebox .popup').outerWidth() / 2))
      // Below Line 
      $(document).trigger('reveal.facebox').trigger('afterReveal.facebox'); // This Line
    }

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

$(document).bind('afterReveal.facebox', function() {
    tinyMCE.execCommand('mceAddControl', true, 'content');
    // Here 'content' is editor (textarea) id
});

Примечание: Не нужно инициализировать tinyMCE config во всплывающем окне Facebox.

0 голосов
/ 23 марта 2012

Лучше всего будет показать нам вашу полную конфигурацию инициализации для вашего tinymce. Если редактор не отображается, и вы не получаете ошибку javascript с помощью консоли разработчика, весьма вероятно, что ваша конфигурация tinymce является ошибочной.

...