Page History

Anchor
top top

In this section

...

Adding a Field to an Element Component

The section Quick Start - 1 explains how to create a very basic element component using the element archetype. The archetype generates the following files (in the case of the HelloWorld example):

...

Throughout this section the HelloWorld element will be used as an example.

Adding a Property to the Business Object

The Business object CustomElementImpl.java represents the data model of the Hello World element. Since we want the author field to be persisted, we will add this property to this class. We define the property as an instance variable and add a getter and setter for it:

...

@Property
public String getAuthor() {
	return JcrUtil.getString(getNode(), "myJcrPrefix:author");
}
public void setAuthor(String author) {
	JcrUtil.setString(getNode(),"myJcrPrefix:author", author);
}

Adding a Property to the Form Backing Object (FBO)

Since the author must also be editable in the Editor, we also add the field to the Form backing object, CustomElementFBO.java. This is done in a similar way as was done for the business object:

...

private String myAuthor;
public String getAuthor() {
	return myAuthor;
}
public void setAuthor(String author) {
	myAuthor= author;
}

Adding a Language Label

Anchor
adding_a_language_label adding_a_language_label

Because we want the word “Author” to be translated in the proper language in the Workspace as well as the website environment, we must define a language label for it. The element archetype generated two language files, one for US English (messages_en_US.properties) and one for Dutch (messages_nl_NL.properties) (additional language files can also be added). When creating language files, be sure that they conform to the development guidelines (G026, G027 and G028 in particular).

...

helloworldelement.author=Author

Adding a Field to the Edit JSP

Anchor
adding_a_field_to_the_edit_jsp adding_a_field_to_the_edit_jsp

Because "Author" must be editable by users logged in to the XperienCentral Workspace, we must add the field to the JSP that renders the element (editCustomElement.jspf). Standard tags for property editing are supported by the wmedit tag library. The wmedit tag library generates the HTML for editing a property of a particular type. The property type that the tag should generate the HTML for is provided after the “:” separator. For a regular text input field the edit tag is input. To create an input field for editing the author, add this to the JSP:

...

<%@ taglib uri="http://java.sun.com/jstl/fmt"prefix="fmt" %>
<%@ taglib prefix="wmedit" uri="http://www.gx.nl/taglib/wmedit"%>

Adding a Field to the Show JSP

The "Author" field can now be edited in the Editor but must also be shown in the website environment. We therefore enhance the show JSP (showCustomElement.jspf) to display its value:

...

<c:set var="element" value="${presentationcontext.element}" />
Author: ${element.author}

Back to Top

...

Adding a Field to a Panel Component

In Quick Start - 1 it is explained how to create a very basic panel component using the panel archetype. This panel consists of only one tab, the "HelloWorld" tab. The archetype generates the following files in case of the HelloWorld example:

...

Adding a Property to the Form Backing Object

Since the author must be editable in the panel within the Editor, we also add the field to the form backing object (CustomTabFBO.java):

...

private String myAuthor;
public String getAuthor() {
	return myAuthor;
 }
 public void setAuthor(String author) {
	myAuthor = author;
 }

Language Label

See Adding a Language Label for a complete description of adding language labels. The following snippet should be added to each language file:

...

The following snippet should be added to the customTab.jspf (see Adding a field to the edit JSP for a complete description of adding a field to the edit JSP):

...

<fmt:message key="helloworldpanel.author" />: 
<wmedit:input path="command.author" /> 

Back to Top

...

Adding a field to a Media Item component

In Quick Start - 1 it is explained how to create a very basic media item component using the media item archetype. The archetype generates the following files in case of the HelloWorld example:

...

1. Add the property to the Media item version (CustomMediaItemVersionImpl.java).
2. Add the property to the form backing object (CustomMediaItemVersionFBO.java).
3. Add a label to the language files to translate “Author” in the supported languages.
4. Add the field to the edit JSP (editMetadata.jspf).

Adding a Metadata Field to the Media Item Version

The Business object CustomMediaItemVersionImpl.java represents the data model of the HelloWorld media item. Since we want the author metadata field to be persisted we add this property to this class. We define the property as instance variable and add a getter and setter for it:

...

 private String myAuthor;
 
 public String getAuthor() {
	return myAuthor;
 }
 
 public void setAuthor(String author) {
	myAuthor = author;
 }

Language Label

See section Adding a Language Label for a complete description of adding language labels. The following snippet should be added to each language file:

...

When adding language labels, be sure that they conform to the WCB Development Guidelines (G027 and G028 in particular).

Adding a Field to the Edit JSP

See Adding a Field to the Edit JSP for a complete description of adding fields to the edit JSP. The following snippet should be added to the editMetadata.jspf:

...

Back to Top

...

Anchor
permission_level_html_js permission_level_html_js

Setting the Correct Permission Level for HTML and JavaScript

When you add fields to a custom element, page metadata, custom content type and/or a panel that accept HTML or JavaScript and/or are rendered without any escaping mechanism, they should only be accessible to roles with at least the Administrator permission group assigned.

Back to Top

...