CheckBox
<input id="repair_cover_glass_broken"
type="checkbox"
value="Cover glass broken"
data-win-control="HFWinJSCtrl.CheckBox"
data-win-options="{
label: 'Cover glass broken',
list: true,
defaultValue: true,
style: 'default | highlightChecked | toggleButton',
toggle: {
defaultClass: 'hf-radio-red',
checkedClass: 'highlight'
}
}">
Property | Type | How to use | Description |
---|---|---|---|
defaultValue | Boolean | defaultValue: true | Set the defaultValue to "true" to display the CheckBox as checked by default. |
disabled | Boolean | disabled: true | Set "true" whenever the checkbox should be disabled. The default value is false. |
doNotCopy | Boolean | doNotCopy: true | Set "true" whenever the field should get deleted if form is copied. |
label | String | label: 'Cover glass broken' | Define a label set next to the checkbox (optional) |
htmlLabel | String | htmlLabel: 'Cover glass <strong>broken</strong>' | Define a label that allows html tags inside the text set next to the checkbox. If a label and a htmlLabel is set, the htmlLabel overwrites the label. |
list | Boolean | list: true | Set "true" whenever the content should show up in the list on the dashboard. |
listOptions | Object | listOptions: {...} | Set additional options for controls with list equals true . E.g. set custom label for filter/sort/group dialogs or hide them complettely. |
persistent | String | persistent: 'user' | The value "user" sets the initial value of the checkbox to the value of the previous form item of the current user and overwrites any defaultValue. |
required | Boolean | required: true | Set "true" if the control has to be filled in. |
style | String | `style: 'default | highlightChecked |
toggle | String | toggle: {defaultClass: 'hf-radio-orange', checkedClass: 'highlight'} | Define up to two CSS classes applied to the container-div of the checkbox to emphasize the toggle-effect of the form control. At least the "defaultClass" has to be defined. Note: Use in case of style: 'toggleButton to assign the background color, this option is ignored in case of the other two possibilities. |
tooltip | String | tooltip: 'Please indicate at least one cause of damage.' | Write a comment to provide further information about the field. A question mark will then be shown within the label and with a click/tap on it, the information will occur. |
visiting | Boolean | visiting: true | Set "true" whenever the form element should be marked as "visited" when the user has clicked or tapped at the form field. |
onChanged | Function(value: boolean, hfValue: string) | onChanged: HFFormdefinition.Namespace.Method | Call a pre-defined JS-method to do something when the status of the control changes |
listOptions Object
Property | Type | How to use | Description |
---|---|---|---|
dialogText | String | dialogText: 'Display Text' | Set custom label for filter/sort/group dialogs. |
dialogHide | Boolean | dialogHide: true | Hide field from filter/sort/group dialogs. |
Stored data
<input id="repair_cover_glass_broken" type="checkbox"
data-win-control="HFWinJSCtrl.CheckBox" value="Cover glass broken"
data-win-options="{ label: 'Cover glass broken', list: true, defaultValue: true }"
>
For each checked CheckBox inside your forms there are two value pairs of stored data:
First the information if the Checkbox is checked
{
"id": "repair_cover_glass_broken",
"value": true
}
and for the defined value:
{
"id": "repair_cover_glass_broken_HFValue",
"value": "Cover glass broken"
}