...
Code Block | ||||
---|---|---|---|---|
| ||||
<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"
%><%@include file="/apps/myapp/core/global.jsp"
%><slice:lookup var="model" type="<%=com.cognifide.myapp.components.richtext.TextModel.class%>"/>
<sv:validate object="${model}" displayErrors="${wcmMode.edit}">
${model.text}
</sv:validate> |
The taglib is registered under sv
prefix. The The TextModel
object (obtained using <slice:lookup>
tag) is validated in line 4. If the object is valid, the body of the validation tag will be rendered. Otherwise, error message will be output in the following format:
...
Such format allows you to style them appropriately.
Note | ||
---|---|---|
| ||
It should be noted that validation messages should not be displayed in publish, they should be displayed only in edit mode. To achieve this, displayErrors attribute should be set to true only in edit mode (see line 4 in above example) |
Sum up of attributes:
Attribute | Description | Required? |
---|---|---|
object | object that needs to be validated | |
title | Heading of validation messages displayed to authors, "Validation messages:" by default | |
displayErrors | Defines if error messages should be displayed or not. The boolean value which should be based on CQ mode | |
var | Variable where validation result will be stored for further use |
Blank values approach
There is a special case of validation where we'd like to inform authors that the component has not been edited yet and it needs author's attention. This is especially useful when an author drags and drops a new component onto paragraph system, and the component needs to render itself. Usually, such component cannot pass validation without being edited first what's resulting in displaying error messages. This can be, in turn, misleading for authors.
Therefore, the blank values approach has been introduced. It allows a component to render its predicted output, meaning how the component will look like after it is initially edited.
The blank value approach is based on validate
tag. A component implementing blank values approach behaves as follows:
- If a Java model is blank and
displaysErrors
is set totrue
(should be only in edit mode), the body of validation tag is not rendered - blank value is rendered instead. Blank value is either a piece of HTML or a placeholder image. - If a Java model is blank and
displaysErrors
is set tofalse
(should be in mode other than edit), the body of validation tag does render nothing - If a Java model is not blank, the validation of the model is performed and, depending on validation result, either body of validation tag or error messages are rendered.
To display a blank value, the component must meet the following:
It must define its blank state. This can be achieved using
Validatable
interface by calling thesetBlank
method onValidationResultBuilder
object. E.g.:Code Block import org.apache.commons.lang.StringUtils; import com.cognifide.slice.mapper.annotation.JcrProperty; import com.cognifide.slice.mapper.annotation.SliceResource; import com.cognifide.slice.validation.api.Validatable; import com.cognifide.slice.validation.api.ValidationResultBuilder; @SliceResource public class TextModel implements Validatable { @JcrProperty private String text; @Override public void validate(ValidationResultBuilder result) { if (StringUtils.isBlank(text)) { result.setBlank(true); } } public String getText() { return text; } }
In this example, we assume that the model is blank when its text property is blank. Then the blank value will be displayed instead of the component's actual content.
It should provide the blank value output. It can be done easily by putting an HTML file called blank.html in the component folder. The content of this file will be rendered when the component's model is blank. The content is a pure HTML, is should not contain any server-side scripts. Example blank.html file for a richtext component may look as follows:
Code Block language html/xml <div class="init richtext"> <p>This is a richtext</p> </div>
Please pay attention to
init
class. Thanks to appropriate styling it can render the output in visual distinctive way, e.g. grayed out.
If the blank.html file is missing in the component folder, a default CQ placeholder image is displayed, as defined percq-text-placeholder
CSS class.- It must use
validation
tag in its script.