vuetify-jsonschema-form
vuetify-jsonschema-form copied to clipboard
Selecting correct item from combo based on model value
Hi,
I have a combo with key/value items. However if the form is generated the 'value' is shown in the combox instead of the 'title'
Part of schema
"brand": {
"type": "string",
"title": "Brand",
"x-display": "autocomplete",
"x-itemTitle": "label",
"x-itemKey": "value",
"enum": [
{
"value": 1,
"label": "Brand 1
},
{
"value": 2,
"label": "Brand 2"
},
{
"value": 3,
"label": "Brand 3"
}
],
"required": true,
}
Model:
export default {
data() {
return {
model: {
brand:1
}
}
},
Your schema declares a type string but the enum contains objects, this is not a valid json schema.
To handle displaying a label associated to the value but only storing the value you must use oneOf, cf https://koumoul-dev.github.io/vuetify-jsonschema-form/latest/examples#select
Tnxx for your quick reply.. However still running into some issues..
I've changed my schema to your specs, but i get the following error:
"TypeError: Cannot convert undefined or null to object"
schema:
"manufacturer": {
"type": "object",
"title": "Fabrikant",
"oneOf": [
{
"const": 1,
"title": "Item 1"
},
{
"const": 2,
"title": "Item 2"
},
{
"const": 3,
"title": "Item 3"
}
]
}
You sort of reversed the problem. Your oneOf has numbers in the const property, meaning that it should be inside a property with type number, here the property has type object.
O ghe.. I was in the understanding that "type" was specifying the oneOf.. but if i understand correctly it's specifying the 'value' of the attribute so in my example above the "const" value ?
Yes, that's it.
So far the rendering works fine.. However.. if i have values in my 'model' the label isn't selected in the combobox but instead the 'value' is shown.
Schema:
"manufacturer": {
"type": "string",
"title": "Manufacturer",
"oneOf": [
{
"const": 1,
"title": "Item 1"
},
{
"const": 2,
"title": "Item 2"
},
{
"const": 2,
"title": "Item 2"
}]
}
Model:
const model = {
manufacturer: 1
};
@albanm any ideas ?
I don't understand, this example looks like it is working fine.
hmm i see, strange.. will check my code again then :) Thanks for your feedback and example