Last updated: 2024-03-20
Unterstanding and extending the inputRow fragment
If your project has a frontend with Thymeleaf and contains at least one form, the inputRow fragment is also included. This simplifies the management of forms and the different types are mapped within the fragment. How does this work and how can we add more attributes here?
Example of a simple form using inputRow
Functionality of the inputRow fragment
After code generation, the inputRow fragment initially has five attributes: object and field are required parameters of type String. They define the referenced object, which must be present in the model, and its field to be displayed. By using Thymeleafs preprocessing capabilities like __${field}__, the string values are used as part of the actual expression.
In addition to outputting the value, the label property is also generated from these values with __${object}__.__${field}__.label. A validation error for the field is printed out if present.
Extract of fragments/forms.html
Two other optional parameters are type and required. The type is 'text' by default, but can be overridden to create e.g. a checkbox ('checkbox') or a dropdown ('select'). Whether the field is required is retrieved by reflection from the model object. However, this can be overridden with required=true or required=false if necessary.
For the types 'radio', 'select' and 'multiselect' the options to be rendered are expected in the model. These should correspond to the field name with the suffix 'Values' and have the type List or Map. For a map the key corresponds to the submitted value of our option, for a list the value and displayed name are identical.
With the inputClass parameter we can add further classes directly at our input elements. This class is added to the specific form element depending on the type (<input>, <select> or <textarea>).
Initializing the options for our dropdowns in the controller
All aspects described so far are generated automatically when a CRUD frontend is selected for an entity in Bootify.
Extending the inputRow fragment
The HTML code of our fragment can be customized as desired and then automatically applies to all forms. Therefore, it may also be useful to define additional dynamic attributes.
Extension of our fragment by the optional rowClass attribute
With the new rowClass attribute, for instance, the following form would now be possible.
Using the new rowClass attribute
Two more interesting attributes could be readonly and placeholder. The following snippet would allow us to adjust the input HTML element.
Thymeleaf code for setting readonly and placeholder
Readonly should be added as a further parameter at the inputRow fragment. The placeholder - like the label - is automatically read from the messages.properties and integrated into the HTML only if the corresponding property is defined.
The inputRow fragment tends to accumulate more and more attributes in the long run, so one should regularly question the usefulness of all extensions. Nevertheless, the centralization of the form elements offers many advantages that improve readability and adaptability of our code.
