vuetify-jsonschema-form
vuetify-jsonschema-form copied to clipboard
Is it possible to get the selected element property from parent?
Let's say we have this setup
const schema = {
...
items: {
type: 'object',
properties: {
Parent: {
type: 'string'
title: 'Parent'
'x-fromUrl ' : 'https://website_name/api/data',
'x-itemTitle': 'title',
'x-itemKey' : 'id'
properties: {
id: {
type: 'string'
}
}
}
}
},
dependencies: {
Parent: {
properties: {
Child: {
/* POINT OF INTEREST*/
}
}
}
}
}
Given the above sample code, is there a way for the child to be able to get the id of the selected element in the Parent?
I'm trying to prefill that field with the result of this 'x-fromUrl ' : 'https://website_name/api/data/{parent.value.Parent.id}
Thank you so much!
I don't precisely understand the setup, I suppose it should be ok. If you can't make it work maybe you can provide a codepen so that I can help ?
Hi @albanm,
Thank you for the swift response. I'm not really familiar with setting up things on codepen. I guess I'll try to explain it instead. Let's say we have a drop down which contains a list of clients so to visualize we have:
clients = [ A, B, C]
The clients dropdown was populated from an HTTP request.
[
{
id: 1,
name: A,
},
{
id: 2,
name: B,
}
{
id: 3,
name: C,
}
]
clients has another field that depends on it (child) called clientDetails. Is it possible for me to be able to get the selected id from clients and use it in my API call in clientDetails? So I can prefill that field
For some reason, "some_path/{parent.value.clients.id}" doesn't work.
I used this codepen as reference: https://codepen.io/pen?&editors=101
Does it work if your don't define clientDetails as a dependency but as a normal dependency.
Every example in the doc has a link to open it in codepen, you can then edit it to make it fit your problem, save and share the link.
May I ask what do you mean by normal dependency?
I meant normal property, not a dependency.
There's no problem if it's a normal property, if we list all the clientTypes.
x-fromUrl: 'some_path/clientTypes'
However, there's a problem when I use this path. No data is available. Running that same path on postman works.
x-fromUrl: 'some_path/clientTypes/2025'
2025 basically is just the id so I can get more info on that client.
Hi I was able to get this working.
By using the x-itemKey in the url instead of parent.value.clients.id.
Instead of
some_path/{parent.value.clients.id}
Use
some_path/{clients}
If your x-itemKey: id, clients here is the id already.
@albanm, I just noticed that this doesn't fit well with my use case. I want to be able to use the other key-value pair from the result I get from x-fromUrl.
so if let's say I did this :
'x-fromUrl': 'somepath/clients'
and get this as a response
[ { clientId: 1, clientName: 'client_1' clientContact: '1234' }, { clientId: 2, clientName: 'client_2' clientContact: '1234' } ... ]
If I chose the first object in this array of objects on the dropdown for clientName property. Is it possible for me to use the same object as the default value for another property (clientContact) that is a dependency?