Інтеграція FCKeditor в Zend_Form

Мітки: веб-розробка, програмування, zend framework, wysiwyg, zend_form

Интеграция FCKeditor в Zend_Form Интеграция FCKeditor в Zend_Form
Integrating FCKeditor with Zend_Form Integrating FCKeditor with Zend_Form

← Введення в мистецтво модульного тестування в PHPАвтоматизоване тестування з використанням Zend Framework →
Як можна використовувати FCKeditor або будь-який інший WYSIWYG-редактор разом з Zend_Form? Ще одне відносно просте питання. Існує безліч способів за допомогою яких ви можете зробити це, але давайте поглянемо на два найбільш цікавих, на мою думку:
* Додавання деякого JavaScript до вашого Виду (view).
* Створення Zend_Form_decorator
Ми будемо використовувати FCKeditor, але ви можете застосувати показану техніку до інших, і до TINYMCE у тому числі.

Налаштування
Ми розглянемо кожен метод для налаштування FCKeditor з Zend_Form. Вважатимемо що у вас є якийсь контроллер з Видом (view), до якого ви додаєте якийсь простий клас форми як цей:
Прибрати підсвітку коду
1
2
3
4
5
6
7
8
9
10

<?php
Class MyForm extends Zend_Form {
  public function init() {
    //Ми просто додали звичайний елемент textarea на форму
    $this->addElement('textarea', 'content', array(
      'id' => 'txtContent',
      'label' => 'Contents'
    ));
  }
}

Відмітьте, що ми вказуємо ID елементу форми — вам необхідно призначити елемент ID щоб це працювало, не забудьте про це!

Метод 1: додавання JavaScript до Виду (view)
Це більш просте рішення з цих два, але не дуже багаторазове і завжди вимагає ручної реалізації цього кроку.
Простіше кажучи, ми виведемо форму у Вигляді (view) і потім включимо деякий код JavaScript, який буде заміняти textarea вкладишем FCKeditor.

Прибрати підсвітку коду
1
2
3
4
5
6
7

<?php echo $this->form; ?>
 
<script type="text/javascript">
var editor = new FCKeditor('txtContent') ;
editor.BasePath = 'fckeditor/'; // змініть це на шлях до файлів fckeditor
editor.ReplaceTextarea() ;
</script>

Коли сторінка завантажилась, запускається вищезгаданий код JavaScript і замінює textarea на WYSIWYG-редактор. Враховуйте, що для роботи коду JavaScript, вам необхідно включити скрипти FCKeditor в секцію head. Також, якщо ви хочете розмістити блок скрипта в секцію head, пам'ятайте, що це слід вішати на window.onload, інакше просто не працюватиме.

Метод 2: створення свого декоратору
Це вирішення вимагає свій клас декоратору. Це трохи складніше чим перший метод, але після того, як ми створимо декоратор, це буде простіше для багаторазового використання.
Декоратор не змінюватиме розмітку елементів, замість цього ми додамо деякий код JavaScript до помічника inlineScript.
Вигоди даного вирішення в тому, що редактор працюватиме, і навіть якщо щось піде не так — ви побачите звичайный textarea. Якщо б ми використовували, скажімо, бібліотеку інтеграції FCKeditor PHP, не виводилося б взагалі нічого.
Прибрати підсвітку коду
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<?php
class CU_Form_Decorator_FckEditor extends Zend_Form_Decorator_Abstract {
  private $_basePath = 'fckeditor/';
 
  public function setBasePath($path) {
    $this->_basePath = $path;
  }
 
  public function render($content) {
    $view = $this->getElement()->getView();
    $view->inlineScript()->appendScript("
      var editor = new FCKeditor('" . $this->getElement()->getId() . "');
      editor.BasePath = '" . $this->_basePath . "';
      editor.ReplaceTextarea();
    ");
    return $content;
  }
}

Як бачите, декоратор відносно простий. Він просто додає JS-код, необхідний inlineScript і повертає не змінений вміст. У нас також є метод для установки базового шляху FCKeditor, у випадку якщо він інший.
Використовувати цей декоратор дуже просто:
Прибрати підсвітку коду
1
2
3
4
5
6

<?php
// Додамо декоратор до нашого створеного класу форми
$form = new MyForm();
// ім'я  textarea було  content, це означає,
// що  ми можемо отримати доступ таким чином
$form->content->addDecorator(new CU_Form_Decorator_FckEditor());

Зараз, коли ми зробили рендер форми у Виді (view) і рендер inlineScript в кінці layout перед закриваючим body, ми отримали відмінний блок FCKeditor.

Виявлення несправностей
Якщо у вас виникли труднощі із запуском FCKeditor, переконайтеся в його доступності. Інколи, ваші правила rewrite, файлу .htaccess, можуть робити заборону, вам необхідно відкрити доступ для файлів скрипта.
Найбільш простий шлях переконатися, в даному випадку, це спробувати відкрити скрипт безпосередньо через браузер.

Виводи
Інтеграція FCKeditor в Zend_Form є дуже простим завданням. Ми навіть можемо зробити його простим для повторного використання, створивши власний декоратор.

Оригінал: Integrating FCKeditor with Zend_Form

Рейтинг: 12345   << Ви можете поставити оцінку цій статті


Подібні статті:
   6 інструментів для того щоб бути ефективним Web-розробником
   Розуміння області видимості в об’єктно-орієнтованому JavaScript
   10 кроків до швидкого вивчення нової мови програмування
   Введення в мистецтво модульного тестування в PHP
   Автоматизоване тестування з використанням Zend Framework


 
 

Залишити коментар:

Ім'я


E-mail


Повідомлення