Joget DX 8 Stable Released
The stable release for Joget DX 8 is now available, with a focus on UX and Governance.
This article will showcase how to add validation to Rich Text Editor form element.
Any text entered into the editor will be saved as HTML, including whitespaces and empty lines. As it is a WYSIWYG (What You See Is What You Get) editor, it is crucial to ensure that the validation process does not compromise the inherent functionality of the Rich Text Editor. Read more here: Rich Text Editor
Drag "Rich Text Editor" form element into form
Figure 1: Rich Text Editor form element
Select Beanshell Validator for the Rich Text Editor and add the following the code into the Beanshell field. The code will be in charge of the validation on server side.
This example will perform validation on whitespaces and empty lines through the use of stripHTML, stripping all HTML tags before performing validation. This will ensure reliable and accurate validation as empty spaces and white spaces are interpreted as "<p><br></p> " and "<p> <p>" by the Rich Text Editor. You may change the following code to perform various validation accordingly for example:
Length Limitations
Prohibited Content
Content Sanitization
and many more...
import java.util.Arrays; import org.joget.apps.app.service.AppUtil; import org.joget.apps.form.model.Element; import org.joget.apps.form.model.FormData; import org.joget.apps.form.service.FormUtil; public boolean validate(Element element, FormData formData, String[] values) { boolean result = true; for (String value : values) { // Check if editor input is null or is empty System.out.println("Stripped: " + stripHtml(value)); if(value != null && (stripHtml(value).equals(" ") || stripHtml(value).trim().isEmpty())){ String id = FormUtil.getElementParameterName(element); //This will display the custom error message //Customize it accordingly formData.addFormError(id, "ILLEGAL VALUE"); result = false; } System.out.println(value.trim()); } return result; } public String stripHtml(String html) { // Remove HTML tags using a regular expression return html.replaceAll("<[^>]*>", ""); } // Call validate method with injected variable return validate(element, formData, values);
Figure 2: Beanshell validator code
Test and check result
Figure 3: Validation for whitespaces