Integrating TinyMCE with Tapestry 5 and jQuery
If you use Tapestry5-jQuery in your Tapestry 5 project, you can easily integrate the TinyMCE Rich Text Editor as a mixin for textareas in your form.
- Download TinyMCE jQuery package from here.
- Add all the downloaded files, including the langs and themes folder into a folder in your Web application context. For example, add all the files and folders to the Your_Project/WebContent/js/tinymce/ folder
- Add the following class to your mixins package.
import org.apache.tapestry5.ClientElement; import org.apache.tapestry5.annotations.BeginRender; import org.apache.tapestry5.annotations.Import; import org.apache.tapestry5.annotations.InjectContainer; import org.apache.tapestry5.ioc.annotations.Inject; import org.apache.tapestry5.services.javascript.JavaScriptSupport; /** * * @author Jeshurun Daniel * */ @Import(library={"context:/js/tinymce/jquery.tinymce.js", "context:/js/tinymce/tiny_mce.js"}) public class TinyMCE { @Inject private JavaScriptSupport jsSupport; @InjectContainer private ClientElement element; @BeginRender void begin() { jsSupport.addScript("tinyMCE.init({ mode : "exact", elements: "%s" });", element.getClientId()); } }
- To use it, simply add the mixin to any element you want, such as textareas or textfields.
<t:textarea value="value" t:mixins="tinymce"/>
Leave a Reply