tinymce编辑器。 按钮不显示

Question

im trying to use this the editor like in this tutorial http://kpachar.blogspot.de/2010/06/tinymce-as-jsf-2-composite-component.html unfortunately it doesnt work for me. i can see the textarea, but there are not bottons to edit.

im having the editor in the same project on different places, but at the one place it works, at the other it does not.

I tried it with different browsers, same problem everywhere. Firebug shows that the scripts im calling are included and alert proves it.

scripts I call:

<composite:implementation>
    <h:outputScript name="tiny_mce/tiny_mce.js" target="head"/>
    <h:outputScript name="editors/tinymce_init.js" />
    <h:inputTextarea id="textarea" value="#{cc.attrs.value}" rows="5" cols="80"
        styleClass="tinymce" />
</composite:implementation>

But the scripts called by the script tiny_mce.js cant load.

Failed to load: http://localhost:8080/SOCIATO_Testcommunity/javax.faces.resource/tiny_mce/langs/en.js

Failed to load: http://localhost:8080/SOCIATO_Testcommunity/javax.faces.resource/tiny_mce/themes/simple/editor_template.js

Both files are in the "resources" folder but the server tries to find them in "javax.faces.resource". Other files(fe called by outputScript) find this files automatically. How can I tell the server where to find this scipts called by tiny_mce?

Any idea, please?

Answer 1

They're resolved relative to the location of the original script and their URLs need to match the URL pattern of the FacesServlet and thus need an additional .jsf or .xhtml suffix. You basically need to edit the TinyMCE JS source code to fix the URLs from where those dependencies are been loaded. It's probably easier to just include them by <script> instead of <h:outputScript> .

<script src="#{request.contextPath}/resources/tiny_mce/tiny_mce.js" />
<script src="#{request.contextPath}/resources/editors/tinymce_init.js" />

Or just adopt a component library which has already solved this for you, such as PrimeFaces or RichFaces.