Skip to content

Commit a907f99

Browse files
committed
updated documentation for vue-generators/vue-form-generator#556
1 parent 966254b commit a907f99

File tree

1 file changed

+31
-16
lines changed

1 file changed

+31
-16
lines changed

fields/radios.md

+31-16
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,31 @@ This is simple list of radio buttons to select
66

77
| Property | Default | Accepted values | Description |
88
| --- | --- | --- | --- |
9-
| `values` | _none_ | `Array` or `Function` | List of items. It can be an array with items, or a `Function`, what is resulted an array. The item can be a `String`, `Boolean`, `Number` or an `Object` (with an `value` and a `name` properties). You can change `value` and `name` \(under `radiosOptions`\) to select any properties of that object as value or name. |
9+
| `values` | _none_ | `Array` or `Function` | List of items. See details below. |
1010
| `radiosOptions` | {} | `Object` | Settings to radios component. See details below. |
1111

12+
### `values`
13+
It can be an array with items, or a `Function` then returns an array of items. The items can be a `String`, `Boolean`, `Number` or an `Object` (see below). |
14+
15+
#### Item `Object`
16+
| Property | Default | Accepted Values | Description |
17+
| --- | --- | --- | --- |
18+
| `name` | _none_ | `String` | The text displayed beside the radio button (ie; Label) |
19+
| `value` | _none_ | `String` | The value of the radio option stored in the model |
20+
| `disabled` | _none_ | `Boolean` or `Function` | Used to disable this radio option |
21+
22+
You can change `value` and `name` \(under `radiosOptions`\) to select any properties of that object as the value or name.
23+
24+
If `disabled` is set to a function, it will be passed a reference to the `model`
25+
1226
### `radiosOptions`
1327

1428
| Property | Default | Accepted values | Description |
1529
| --- | --- | --- | --- |
1630
| `value` | _none_ | `String` | Used to select any properties from object in `values` to use as actual value to save in model. |
1731
| `name` | _none_ | `String` | Used to select any properties from object in `name` to use as display in the list |
1832

33+
1934
## Usage
2035

2136
#### Radios field with array of strings:
@@ -43,17 +58,17 @@ This is simple list of radio buttons to select
4358
label: "Choose you product color",
4459
model: "color",
4560
values: [
46-
{name: "Deep Pink", value:"#FF1493"},
47-
{name: "Peach Puff", value:"#FFDAB9"},
48-
{name: "Dark Orange", value:"#FF8C00"},
49-
{name: "Light Green", value:"#90EE90"}
61+
{ name: "Deep Pink", value:"#FF1493" },
62+
{ name: "Peach Puff", value:"#FFDAB9" },
63+
{ name: "Dark Orange", value:"#FF8C00", disabled: (model) => {
64+
if(model.disableOrange) { return true; }
65+
return false;
66+
},
67+
{ name: "Light Green", value:"#90EE90", disabled: true }
5068
]
5169
}
5270
```
5371
54-
55-
56-
5772
#### Radios field with custom object values:
5873
5974
```js
@@ -62,14 +77,14 @@ This is simple list of radio buttons to select
6277
label: "Identify the dolphin's name from the photo",
6378
model: "dolphin",
6479
values: [
65-
{common_name: "White-beaked dolphin", binomial_nomenclature:"Lagenorhynchus albirostris"},
66-
{common_name: "Peale's dolphin", binomial_nomenclature:"Lagenorhynchus australis"},
67-
{common_name: "Northern right whale dolphin", binomial_nomenclature:"Lissodelphis borealis"},
68-
{common_name: "Common bottlenose dolphin", binomial_nomenclature:"Tursiops truncatus"},
69-
{common_name: "Long-beaked common dolphin", binomial_nomenclature:"Delphinus capensis"},
70-
{common_name: "Pacific white-sided dolphin", binomial_nomenclature:"Lagenorhynchus obliquidens"},
71-
{common_name: "Pantropical spotted dolphin", binomial_nomenclature:"Stenella attenuata"},
72-
{common_name: "Chilean dolphin", binomial_nomenclature:"Cephalorhynchus eutropia"}
80+
{ common_name: "White-beaked dolphin", binomial_nomenclature:"Lagenorhynchus albirostris" },
81+
{ common_name: "Peale's dolphin", binomial_nomenclature:"Lagenorhynchus australis" },
82+
{ common_name: "Northern right whale dolphin", binomial_nomenclature:"Lissodelphis borealis" },
83+
{ common_name: "Common bottlenose dolphin", binomial_nomenclature:"Tursiops truncatus" },
84+
{ common_name: "Long-beaked common dolphin", binomial_nomenclature:"Delphinus capensis" },
85+
{ common_name: "Pacific white-sided dolphin", binomial_nomenclature:"Lagenorhynchus obliquidens" },
86+
{ common_name: "Pantropical spotted dolphin", binomial_nomenclature:"Stenella attenuata" },
87+
{ common_name: "Chilean dolphin", binomial_nomenclature:"Cephalorhynchus eutropia" }
7388
],
7489
radiosOptions: {
7590
value:"binomial_nomenclature",

0 commit comments

Comments
 (0)