docs.modx.pro
  1. Extras
  2. PageBuilder
  3. Field types

Field types reference ​

35 types in Free and 27 in Pro. Most Pro types are enabled by advanced-fields. Types datasource, form, product, and products also require capabilities datasources, forms, and minishop3. Every type has a page: schema JSON and a section data block.

Common meta keys (tab, width, description, default, active): overview.

Free ​

typeLayerPageOutput and example
textFreetextJSON and Fenom
emailFreeemailJSON and Fenom
textareaFreetextareaJSON and Fenom
richtextFreerichtextJSON and Fenom
aceFreeaceJSON and Fenom
numberFreenumberJSON and Fenom
urlFreeurlJSON and Fenom
slugFreeslugJSON and Fenom
selectFreeselectJSON and Fenom
multiselectFreemultiselectJSON and Fenom
radioFreeradioJSON and Fenom
checkboxFreecheckboxJSON and Fenom
checkboxgroupFreecheckboxgroupJSON and Fenom
yesnoFreeyesnoJSON and Fenom
toggleFreetoggleJSON and Fenom
dateFreedateJSON and Fenom
timeFreetimeJSON and Fenom
datetimeFreedatetimeJSON and Fenom
colorFreecolorJSON and Fenom
colorpaletteFreecolorpaletteJSON and Fenom
fileFreefileJSON and Fenom
imageFreeimageJSON and Fenom
migxFreemigxJSON and Fenom
videoFreevideoJSON and Fenom
buttonFreebuttonJSON and Fenom
resourcelistFreeresourcelistJSON and Fenom
hiddenFreehiddenJSON and Fenom
readonlyFreereadonlyJSON and Fenom
xtypeFreextypeJSON and Fenom
headingFreeheadingJSON and Fenom
repeaterFreerepeaterJSON and Fenom
tagFreetagJSON and Fenom
tvFreetvJSON and Fenom
chunkFreechunkJSON and Fenom
snippetFreesnippetJSON and Fenom

Pro ​

typeLayerPageOutput and example
relationProrelationJSON and Fenom
multirelationPromultirelationJSON and Fenom
galleryProgalleryJSON and Fenom
mapPromapJSON and Fenom
tableProtableInspector grid. JSON and Fenom
embeddedTableProembeddedTableJSON and Fenom
keyvalueProkeyvalueJSON and Fenom
editorjsPro, advanced-fieldseditorjsA new field is created only in Pro. An already saved field still opens and writes
currencyProcurrencyJSON and Fenom
imaskProimaskJSON and Fenom
comboProcomboJSON and Fenom
multicomboPromulticomboJSON and Fenom
tablecomboProtablecomboDropdown from a MODX class. JSON and Fenom
tablemulticomboProtablemulticomboSeveral values from a MODX class. JSON and Fenom
fieldsetProfieldsetJSON and Fenom
dependentProdependentJSON and Fenom
jsongridProjsongridJSON and Fenom
daterangePro, advanced-fieldsdaterangeJSON and Fenom
iconPro, advanced-fieldsiconJSON and Fenom
linkPro, advanced-fieldslinkJSON and Fenom
documentsPro, advanced-fieldsdocumentsJSON and Fenom
addressPro, advanced-fieldsaddressJSON and Fenom
schedulePro, advanced-fieldsscheduleJSON and Fenom
datasourcePro, capability datasourcesdatasourceJSON and Fenom
formPro, capability formsformJSON and Fenom
productPro, capability minishop3productJSON and Fenom
productsPro, capability minishop3productsJSON and Fenom

Composite scenarios ​

showWhen ​

The field is visible when another field matches value (not equals).

json
{
  "name": "extra_url",
  "type": "url",
  "label": "Extra link",
  "showWhen": { "field": "show_extra", "value": true }
}

Implementation: fieldVisibility.ts.

optionsSource ​

json
{
  "name": "template",
  "type": "tablecombo",
  "label": "Template",
  "optionsSource": {
    "class": "modTemplate",
    "valueField": "id",
    "labelField": "templatename",
    "limit": 100
  }
}

Processor: mgr/field/options. Hook: pbOnFieldValues.

Resource tables ​

Use the resource Tables tab or Collections tab type table. Field embeddedTable stores table_key and query options. See table settings and CMP.

Aliases ​

Full list in FIELD_TYPE_ALIASES (fieldDefaults.ts). Common: relationship → relation, resources → resourcelist, boolean / listyesno → yesno, onlyreading → readonly, colorpicker → color, editor_js → editorjs.

See also ​