A Section Message with Link Component is a form element that displays informational, warning, or error messages within a section of a form. It can include hyperlinks and formatted content, and can optionally function as a custom error message.
This component is used to communicate important information, guidance, or errors to users directly within the form. Key features include:
Title & Message: A main heading (title) and message (message) to convey the purpose or alert.
Message Type: Can be "info", "warning", or "error", controlling the visual style of the message.
Extra Message: Supports HTML content (extraMessageAsHtml) for rich formatting like lists or bold text.
Links: Can include one or more clickable links, each optionally localized with different URLs for different languages (urlLocales).
Custom Error Mode: Can function as a custom error message, requiring the field and showing a message if validation fails.
Expressions: Can dynamically hide or show the message based on form state using expressions.
Use Cases:
Complete JSON Object
{
"key": "customsectionmessagewithlinkTextinputPweyO",
"id": "formly_19_customsectionmessagewithlink_customsectionmessagewithlinkTextinputPweyO_1",
"type": "customsectionmessagewithlink",
"props": {
"links": [
{
"url": "http://google.com",
"urlLocales": {. // <----optional
"en-US": "http://google.com/en",
"fr-FR": "http://google.com/fr",
"rw-RW": "http://google.com/rw",
},
"name": "Google Link",
"selfTarget": true
},
{
"url": "http://facebook.com",
"urlLocales": {. // <----optional
"en-US": "http://facebook.com/en",
"fr-FR": "http://facebook.com/fr",
"rw-RW": "http://facebook.com/rw",
},
"name": "Facebook"
}
],
"title": "GuidelInes",
"message": "This is a message about this section",
"messageType": "warning",
"extraMessage": "<ol><li>Download the form here</li><li>Download the form here</li></ol>",
"extraMessageAsHtml": true
}
}
/// OR AS A CUSTOM ERROR MESSAGE
{
"key": "customsectionmessagewithlinkTextinputPweyO",
"id": "formly_19_customsectionmessagewithlink_customsectionmessagewithlinkTextinputPweyO_1",
"type": "customsectionmessagewithlink",
"props": {
"links": [],
"title": "",
"message": "This is a message about this section",
"messageType": "error",
"required": true,
"extraMessage": "",
"extraMessageAsHtml": true
},
"expressions": {
"hide": "//// HIDE WHEN EXPRESSION IS TRUE ///",
}
}
Allowed Custom Properties
SRD Link Attachment uploads
Use the POST attachment upload API to upload the file using the defined name, provided file, changeRequestId.
Use the file key returned for the for the link item in the field props.
Upload attachment:
https://service-engine.devgov3.iremboinc.com/service/swagger-ui/index.html#/attachment-template-controller
Download file:
https://service-engine.devgov3.iremboinc.com/service/swagger-ui/index.html#/file-manager-controller