Building a form? Browse all form components (36 field types, grouped by purpose), or start with the Form Builder overview for the screen itself.
- Components Every field type: when to use it, its props, and JSON examples
- Form Builder overview The Form Builder screen: preview, wizard, code editor and field settings
- Form Rules Hierarchy, keys, labels, required fields, expressions, visibility and validation
- Validators Built-in and cross-field validators
- Custom Expressions Multi-statement expressions and dynamic options
- Form State What formState holds and how fields share data
- Wrappers condition, field, form-field and hide-field wrappers
- Using Hint and Hint Position Help text under or beside a field
IremboHub forms are built with Angular Formly. Each form is a JSON configuration describing sections, groups, blocks, and fields.
Every field sits inside a block inside a formly-group inside a sections element. There is exactly one sections per form.
Before building any field, read the Form Rules — they cover hierarchy, keys, labels, the required mechanism, expressions, visibility, and validation conventions that apply to every component.
- Form Rules Keys, labels, required mechanism, expressions, visibility, validation — conventions that apply to every field.
- customcascadingdropdowns Province → District → Sector → Cell → Village hierarchy picker.
- customcurrencyformatinput Comma-formatted monetary amount input (e.g. 1,000,000 RWF).
- customdatepicker Date-only picker with range and weekday constraints.
- customdropdown Single or multi-select dropdown, static or API-driven.
- customfileupload File upload sent as base64 inline with the payload.
- customgenericdatafetch Input that triggers an API lookup and populates downstream fields. Also covers customdirectdatafetch.
- customidinput National ID / Child ID / NIN with NIDA verification.
- custominternalfileupload File upload pre-uploaded to CDN; only the reference is submitted.
- customphonenumber International phone number input with country flag.
- customsectionmessagewithlink Styled banner with optional title, HTML content, and clickable links. Use this for any banner in a form.
- customtininput Company TIN with RDB/RRA registry verification and field auto-population.
- genericbuttonfetch Standalone button that triggers an API lookup on click, with no input field.
- input Single-line text field.
- radio Mutually exclusive radio button group.
- Cross-field validators Compare fields, enforce repeater uniqueness, and validate JSON-keyed response values.
Older pages kept in this wiki for this topic: