Versions Compared

Old Version 7

changes.mady.by.user Simon Mittlboeck-Jungwirth

Saved on

compared with

New Version 8

changes.mady.by.user Simon Mittlboeck-Jungwirth

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Currently the following input types are supported:

...

  • number
  • text
  • radio
  • checkbox
  • date
  • range
  • textarea
  • picture

Number input

Expand


numberbasic

[
  {
    "inputTemplate": "Soll: {targetPreasure} bar",
    "inputs": [
      {
        "type": "number",
        "variable": "targetPreasure"
      }
    ]
  }
]

Image Added

complete
[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "number",
        "variable": "targetPreasure",
        "label": "Druck: ", // instead of the inputTemplate a label can be set which is display above the input
        "decimalDigits": 2, // sets the number of decimal digits - default 0
        "thousandSeperator": true, // controls if a thousand seperator should be shown - default false
        "style": "background-color: lightblue;" // custom style 
      }
    ]
  }
]

Image Added


numberbasic

[
  {
    "inputTemplate": "Soll: {targetPreasure} bar",
    "inputs": [
      {
        "type": "number",
        "variable": "targetPreasure"
      }
    ]
  }
]

Image Modified

complete
[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "number",
        "variable": "targetPreasure",
        "label": "Druck: ", // instead of the inputTemplate a label can be set which is display above the input
        "decimalDigits": 2, // sets the number of decimal digits - default 0
        "thousandSeperator": true, // controls if a thousand seperator should be shown - default false
        "style": "background-color: lightblue;" // custom style 
      }
    ]
  }
]

Image Modified

Text input

text


basic


[
  {
    "inputTemplate": "Bezeichnung: {description}",
    "inputs": [
      {
        "type": "text",
        "variable": "description"
      }
    ]
  }
]

Image Modified

complete
[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "text",
        "variable": "description",
        "label":"Bezeichnung: ",
        "style":"color: red"
      }
    ]
  }
]

Image Modified

Radio input

radio


basic

[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "radio",
        "label": "Ja",
        "value": true,
        "variable": "result"
      },
      {
        "type": "radio",
        "label": "Nein",
        "value": false,
        "variable": "result"
      }
    ]
  }
]

Image Modified

advanced
[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "radio",
        "label": "Ja",
        "value": 1,
        "variable": "result",
        "iconVisible": false,
        "color": "btn-primary"
      },
      {
        "type": "radio",
        "label": "Nein",
        "value": 2,
        "variable": "result",
        "deselectable": false,
        "color": "btn-secondary"
      },
      {
        "type": "radio",
        "label": "Vielleicht",
        "value": 3,
        "variable": "result",
        "deselectable": false,
        "color": "btn-success"
      },
       {
        "type": "radio",
        "label": "Weiß nicht",
        "value": 4,
        "variable": "result",
        "deselectable": false,
        "color": "btn-danger"
      }
    ]
  }
]

Image Modified

Checkbox input

checkboxbasic

[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "checkbox",
        "label": "Druckprüfung",
        "variable": "result1"
      },
      {
        "type": "checkbox",
        "label": "Temperaturprüfung",
        "variable": "result2"
      }
    ]
  }
]

Image Modified

advanced
[
  {
    "inputTemplate": "1: {result1} 2: {result2}",
    "inputs": [
      {
        "type": "checkbox",
        "label": "Druckprüfung",
        "variable": "result1",
        "color": "btn-success"
      },
      {
        "type": "checkbox",
        "label": "Temperaturprüfung",
        "variable": "result2",
        "color": "btn-danger"
      }
    ]
  }
]

Image Modified

Date input

datebasic

[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "date",
        "label": "Druckprüfung",
        "variable": "result"
      }
    ]
  }
]

Image Modified

advanced
[
  {
    "inputTemplate": "",
    "inputs": [
      {
        "type": "date",
        "label": "Druckprüfung",
        "variable": "result",
        "customFormat": "YYYY/MM/DD",
        "useCurrent": true,
        "minDate": "2023/01/01",
        "maxDate": "2024/01/01"
      }
    ]
  }
]

Image Modified

Range input

rangebasic

[
  {
    "inputTemplate": "Druck: {druck}",
    "inputs": [
      {
        "type": "range",
        "variable": "druck",
        "min": 10,
        "max": 350,
        "step": 10
      }
    ]
  }
]

Image Modified

Textarea input

textarea


basic

[
  {
    "inputTemplate": "Beschreibung",
    "inputs": [
      {
        "type": "textarea",
        "variable": "result"
      }
    ]
  }
]

Image Modified

advanced
[
  {
    "inputTemplate": "Beschreibung",
    "inputs": [
      {
        "type": "textarea",
        "variable": "result",
        "rows":10,
        "placeholder": "placeholder..."
      }
    ]
  }
]

Image Modified

Picture input

picturebasic

[
  {
    "inputTemplate": "Foto",
    "inputs": [
      {
        "type": "picture",
        "variable": "photo"
      }
    ]
  }
]

Image Modified