Skip to content

Commit 4971c06

Browse files
authored
fix(form-group): add missing disabled prop (#2106)
* fix(form-group): add missing disabled prop Disabled is only applicable when the a `fieldset` is rendered. Note that not all browsers will disabled the inputs inside of a disabled fieldset. Fixes #1920 * Update README.md
1 parent cc6eb8b commit 4971c06

File tree

2 files changed

+10
-1
lines changed

2 files changed

+10
-1
lines changed

src/components/form-group/README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,11 @@ semantic grouping of related form controls:
189189
<!-- form-group-nested.vue -->
190190
```
191191

192+
## Disabled form-group
193+
Setting the `disabled` prop will disable the rendered `<fieldset>` and, on most
194+
browsers, will disable all the input elements contained within the fieldset.
195+
196+
`disabled` has no effect when `label-for` is set (as a `fieldset` element is not rendered).
192197

193198
## Validation state feedback
194199
Bootstrap includes validation styles for `valid` and `invalid` states

src/components/form-group/form-group.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ export default {
140140
class: this.groupClasses,
141141
attrs: {
142142
id: this.safeId(),
143-
disabled: this.disabled,
143+
disabled: this.labelFor ? null : this.disabled,
144144
role: 'group',
145145
'aria-invalid': this.computedState === false ? 'true' : null,
146146
'aria-labelledby': this.labelId,
@@ -214,6 +214,10 @@ export default {
214214
validated: {
215215
type: Boolean,
216216
default: false
217+
},
218+
disabled: {
219+
type: Boolean,
220+
default: false
217221
}
218222
},
219223
computed: {

0 commit comments

Comments
 (0)