Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow object selection in dropdowns #1494

Closed
tdamsma opened this issue Oct 22, 2019 · 3 comments · Fixed by #3411
Closed

Allow object selection in dropdowns #1494

tdamsma opened this issue Oct 22, 2019 · 3 comments · Fixed by #3411

Comments

@tdamsma
Copy link

tdamsma commented Oct 22, 2019

I want to present a dropdown with options that when selected populate the formData with an object.

Consider this schema:

{
  "type": "object",
  "title": "Location",
  "required": [
    "name",
    "latitude",
    "longitude"
  ],
  "oneOf": [
    {
      "const": {
        "name": "Home",
        "latitude": 12.4,
        "longitude": 2.8
      },
      "title": "Home"
    },
    {
      "const": {
        "name": "Work",
        "latitude": 62.4,
        "longitude": 4
      },
      "title": "Work"
    }
  ]
}

I would like a dropdown that gives the options Work and Home but that doesn't store a string but the entire object with name, lat, lon. The schema above does not render properly at all.

The closest I could get to the intended behavior is the following:

{
  "type": "object",
  "title": "Location",
  "required": [
    "name",
    "latitude",
    "longitude"
  ],
  "oneOf": [
    {
      "properties": {
        "name": {
          "const": "Home",
          "default": "Home",
          "readOnly": true
        },
        "latitude": {
          "const": 12.4,
          "default": 12.4,
          "readOnly": true
        },
        "longitude": {
          "const": 2.8,
          "default": 2.8,
          "readOnly": true
        }
      },
      "title": "Home"
    },
    {
      "properties": {
        "name": {
          "const": "Work",
          "default": "Work",
          "readOnly": true
        },
        "latitude": {
          "const": 62.4,
          "default": 62.4,
          "readOnly": true
        },
        "longitude": {
          "const": 4,
          "default": 4,
          "readOnly": true
        }
      },
      "title": "Work"
    }
  ]
}

This renders all the fields disabled. What I would want is to nut render the name/lat/lon fields at all (only the title dropdown), but do pass them to the formData.

@KKS1
Copy link

KKS1 commented Oct 31, 2019

Hi @tdamsma , how about if you use "ui:widget": "hidden" in uiSchema instead of readOnly: true in schema.

@tdamsma
Copy link
Author

tdamsma commented Nov 8, 2019

@KKS1 that would work as a work around to hide the fields, thanks! Still makes using this option slightly cumbersome, as the jsonschema's I use are dynamically generated so this would require generating an accompanying uiSchema. Would be nice if the uiSchema could be merged with the jsonschema, but that is a another discussion

@epicfaace
Copy link
Member

Yeah, merging this into #701 then.

heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Updated `optionId()` to take an index rather than an option
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Also passed index to `optionId()` rather than option
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Updated `optionId()` to take an index rather than an option
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Also passed index to `optionId()` rather than option
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Updated `optionId()` to take an index rather than an option
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Also passed index to `optionId()` rather than option
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 30, 2023
Fixes rjsf-team#1494, reimplementing rjsf-team#1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Updated `optionId()` to take an index rather than an option
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Also passed index to `optionId()` rather than option
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly
heath-freenome added a commit that referenced this issue Jan 30, 2023
* Fix: switch enumOptions rendering widgets to use indexes
Fixes #1494, reimplementing #1562 to make all widgets that render `enumOptions` switch from option value to option index
- In `@rjsf/utils`, added/updated `enumOptionsXXXX` methods that enable using index instead of values
  - Added 100% unit tests for these new methods
  - Updated `optionId()` to take an index rather than an option
  - Also remove the now unnecessary `processSelectValue()` function and its unit test
- In all themes, updated the `CheckboxesWidget`, `RadioWidget` and `SelectWidget` to use the `enumOptions[]` index rather than value for the html elements
  - Utilized the new `enumOptionsXXXX` methods to facilitate this transformation
  - Also passed index to `optionId()` rather than option
  - Updated the tests in `core` and snapshots in the other themes to represent this change from value to index
- Updated the `playground` to add the new `Enumerated Object` example
- Updated the documentation for the new methods and the breaking change this causes
- Updated the `CHANGELOG.md` file accordingly

* Apply suggestions from code review

Co-authored-by: Nick Grosenbacher <nickgrosenbacher@gmail.com>

---------

Co-authored-by: Nick Grosenbacher <nickgrosenbacher@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants