en de ru

ExtJS Control with the editor TinyMCE

Ext.ux.form.TinyMCETextArea - a text area with integrated TinyMCE WYSIWYG Editor.

Version: 5.1
Release date: 2014-09-27
ExtJS Version: 5.0.0
TinyMCE Version: 4.1.5
License: LGPL v3 or later, Sencha License

The integration is done by deriving from the Ext.form.field.TextArea.

Following issues are covered:

  • Initialization in an initially visible and in an initially invisible tab.
  • Correct place occupation by the initialization in any ExtJS layout.
  • Correct resizing by the resizing of the underlying text area.
  • Activation and deactivation of the WYSIWYG editor. Keeping of the cursor position by switching to the HTML text modus.
  • Enabling and disabling of the WYSIWYG editor control.
  • ReadOnly state support.
  • Changing of WYSIWYG settings and CSS file for the editable contents on the fly.
  • Pre-formatting of the HTML text in visible and invisible modus.
  • Focusing of the WYSIWYG editor control.
  • Marking invalid.
  • Tracking dirty state.
  • Skin "extjs" and the native ExtJS windows for the editor inline popups. Only for the 3.x generation of the Editor. The 4.x has good well styled popup windows and they are not overridden any more.
  • Storing and restoring cursor position by inserting of a place holder over a popup window.


TinyMCETextArea in a TabControl
TinyMCETextArea in a Form


Download Sources and Demo        View Example         Implementation Details and Reference

Discussion topic on the ExtJS forum

GitHub Project

Older Versions

Version 4.0, ExtJS Version 4.2.1, TinyMCE Version 4.0.11

Version 2.7, ExtJS Version 4.2.1, TinyMCE Version 3.5.10

Version 2.6, ExtJS Version 4.2.0, TinyMCE Version 3.5.8

Version 2.5, ExtJS Version 4.1.0, TinyMCE Version 3.5.8

Version 2.3, ExtJS Version 4.1.0, TinyMCE Version


If you have any question, contact me over the following form. You can write in English, German or Russian.

If you wish to support me, here is the PayPal link.

Редактирование "на лету"
tinyta (Страница) Редактировать
point_constructor_fixed (Дизайн-шаблон) Редактировать
paypal (Секция) Редактировать
tinyta (Галерея) Редактировать