Primefaces-extensions ckeditor - missing toolbar

Question

I am trying to use the primefaces-extensions ckEditor in my JSF application, as described here. I added the dependency to my pom.xml:

<dependency>
 <groupId>org.primefaces.extensions</groupId>
 <artifactId>primefaces-extensions</artifactId>
 <version>4.0.0</version>
</dependency>

This is how my view looks like:

<p:growl id="editorgrowl" showDetail="true" />
<pe:ckEditor id="editor" value="#{mbEditorController.content}"
 toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
 <p:ajax event="save"
 listener="#{mbEditorController.saveListener}"
 update="editorgrowl" />
</pe:ckEditor>

This is the controller (managed bean):

@ManagedBean(name = "mbEditorController")
@ViewScoped
public class EditorView implements Serializable {
 private static final long serialVersionUID = 6822767317343704211L;
 private String content;
 private String secondContent;
 public EditorView() {
 content = "Type in your text here...";
 secondContent = "This is a second editor";
 }
 public void saveListener() {
 content = content.replaceAll("\\r|\\n", "");
 final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Content",
 content.length() > 150 ? content.substring(0, 100) : content);
 FacesContext.getCurrentInstance().addMessage(null, msg);
 }
 public void secondSaveListener() {
 secondContent = secondContent.replaceAll("\\r|\\n", "");
 final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Second Content",
 secondContent.length() > 150 ? secondContent.substring(0, 100) : secondContent);
 FacesContext.getCurrentInstance().addMessage(null, msg);
 }
 // getters, setters
}

Unfortunately I can't see a toolbar, but just a text input area, as you can see in the following screenshot:

Missing toolbar in ckEditor

UPDATE

There is a javascript error in my console:

http://localhost:8080/MyApp/javax.faces.resource/ckeditor/ckeditor.js.xhtml?ln=primefaces-extensions&v=4.0.0 Failed to load resource: the server responded with a status of 404 (Not Found)

What could cause the problem? Am I missing something?

• tak3shi: Can you see any javascript errors in the console?
• John: @tak3shi: Yes! Sorry, I should have do it before posting. But I still don't know, why it happens. Can you help? Updated my post.
• Jasper de Vries: Another hint can be found in your server log: Unable to find or serve resource, ckeditor/ckeditor.js, from library, primefaces-extensions.
• Jasper de Vries: Possible duplicate of Using ckeditor in jsf page

Answer 1

Add the following dependency:

<dependency>
 <groupId>org.primefaces.extensions</groupId>
 <artifactId>resources-ckeditor</artifactId>
 <version>4.0.0</version>
</dependency>

• John: Thank you very much tak3shi! I was missing this.
• Jasper de Vries: Why oh why isn't this the first line in the showcase!? For 6.0.0 this is also required.