react-jsonschema-form icon indicating copy to clipboard operation
react-jsonschema-form copied to clipboard

Nested dependency doesn't update

Open Bhirahaspathi-Sairam opened this issue 2 years ago • 7 comments

Prerequisites

What theme are you using?

core

What is your question?

I have a react JSON schema like this

{ "type": "object", "properties": { "platform": { "title": "", "$ref": "#/definitions/platform" } }, "definitions": { "username": { "type": "string", "title": "Enter Username" }, "url": { "type": "string", "title": "Enter url" }, "lineId": { "type": "string", "title": "Enter LineID" }, "platform": { "type": "object", "properties": { "platform": { "type": "string", "title": "Select Platform", "enum": [ "--select--", "Facebook", "Instagram", "Line" ], "default": "--select--" } }, "dependencies": { "action": { "oneOf": [ { "properties": { "action": { "const": "Follow" }, "username": { "$ref": "#/definitions/username" } } }, { "properties": { "action": { "const": "Share" }, "url": { "$ref": "#/definitions/url" } } }, { "properties": { "action": { "const": "Add" }, "lineId": { "$ref": "#/definitions/lineId" } } } ] }, "platform": { "oneOf": [ { "properties": { "platform": { "enum": [ "Facebook" ] }, "action": { "type": "string", "title": "Select Action", "enum": [ "Follow", "Share" ], "enumNames": [ "Follow", "Share" ] } } }, { "properties": { "platform": { "enum": [ "Instagram" ] }, "action": { "type": "string", "title": "Select Action", "enum": [ "Follow" ], "enumNames": [ "Follow" ] } } }, { "properties": { "platform": { "enum": [ "Line" ] }, "action": { "type": "string", "title": "Select Action", "enum": [ "Add" ], "enumNames": [ "Add" ] } } } ] } } } } }

on selecting platform an action field is rendered and based on the action field i am rendering different text fields. After Selecting a platform and action the third text field is displayed, However when i change the platform again the text field is still rendered on the screen .

Is it possible to hide the third field when i re select the platform ?

Bhirahaspathi-Sairam avatar Oct 05 '23 23:10 Bhirahaspathi-Sairam

Here is a link to the playground with your example. I'm noticing that when you select a different platform, the action data remains, which is why the input field shows up. In the case of changing from Facebook with Follow as a choice to Instagram with Follow as a choice this looks and works fine. But if the value of action is not consistent with the new choice the value remains. One possible work-around to this is to provide an onChange that detects the when the platform changes and removes the action in the formData that is passed back into the Form. There is probably a new feature that needs to be built to handle what to do with formData for this use case.

heath-freenome avatar Oct 06 '23 19:10 heath-freenome

yes the action field remains.Even though action field is being changed in the ui i.e dropdown , the formdata retains the old action value. Any idea how this can be resolved?

Bhirahaspathi-Sairam avatar Oct 06 '23 20:10 Bhirahaspathi-Sairam

@Bhirahaspathi-Sairam See my updated comment above

heath-freenome avatar Oct 06 '23 20:10 heath-freenome

@heath-freenome is this issue will be resolved in the future ?

Bhirahaspathi-Sairam avatar Oct 07 '23 23:10 Bhirahaspathi-Sairam

I just hit the same problem. Basically, if the value of the conditional field is changed, every field that was rendered based on that property should be reset, before the condition is evaluated (based on the new selected option).

Is this statement correct? If so, is it something that could be considered as a feature?

I understand that with onChange everything can be manipulated, but this requires hardcoding of field names and custom JS code that pretty much defies the purpose of this library.

magaton avatar Oct 12 '23 11:10 magaton

Hello, just to bounce this issue, as it is still unanswered.

magaton avatar Oct 16 '23 06:10 magaton

@magaton Yes, this is a new feature request. Thanks for following up. We'd love help building it.

heath-freenome avatar Oct 16 '23 20:10 heath-freenome