marmelab / react-admin

A frontend Framework for single-page applications on top of REST/GraphQL APIs, using TypeScript, React and Material Design
http://marmelab.com/react-admin
MIT License
24.99k stars 5.25k forks source link

Integrate with react-jsonschema-form for more complex form handling #2896

Closed mnlbox closed 5 years ago

mnlbox commented 5 years ago

Is your feature request related to a problem? Please describe. Integrate with react-jsonschema-form for form generation then we can implement complex form more easier.

Describe the solution you'd like Have a form component that integrate with react-admin for CRUD operation.

Describe alternatives you've considered Do all thing manually.

Let's talking about this here.

djhi commented 5 years ago

Hi and thanks for your suggestion. This is not something we need nor want to maintain and nothing prevents you to do it in userland. I suggest you implement this as an addon package and we'll include it in the ecosystem documentation.

fzaninotto commented 5 years ago

Also, "implement complex form more easily" is a bit too broad for us to understand your need. what exactly are you trying to achieve that the current stack doesn't allow you to do?

UltimateForm commented 4 years ago

@fzaninotto hi, and sorry for resurrecting a dead issue, but I might be able to clarify what he wanted because it is something I want too and I have implemented it on my side. It's essentially about drastically reducing the complexity in writing and maintaining forms for very complex objects -and you can stop reading there if you're not interested, or skip to end

On a project I am working on I have very complex objects that work with modular data, as in, imagine the resource is "person" and depending on the environment I might want or not want to input data for "clothing" and/or "body", each of these can grow quite big in terms of fields

it'd be very inefficient to write and maintain forms for each module in this "person" resource so an automatic measure would be great improvement here, here's a quick example: image

these are buttons inside SimpleForm that go to a new form generated by the package above mentioned, the best thing about this is that the management of this form is centralized at the server through its JsonSchema generation (have in mind that a lot of APIs these days already use this through swagger), which also helps fixing compatibility issues, i.e.: if the server no longer requires a field or a field changed datatype i don't need to worry about updating input fields on the react-admin front end

react-jsonschema-form is a great tool that does a quite good job in generating forms from json-schemas, I've been using it alongside react-admin to tackle the problem above mentioned but there are some itchy aspects in the mix, many arising from the different UI systems, react-jsonschema-form allows you to customize the UI but it's still a limited system and right now it's hard to make it dance well with react-admin - which is why i have placed the generated forms inside dialogs (wrapped as inputs) that are called by the buttons in the image. Another itchy aspect is that react-jsonschema-form is based on redux-forms which you guys probably want to distance yourself from at this point and there is also the bootstrap bias in the package.

What can you do about this? In my opinion integrating with react-jsonschema-form would be a disastrous approach. However I think it'd be of great value to have that level of automation on react-admin. I can do it myself, like most of things, but it will never be as robust. And I do believe this will be a recurring request as react-admin grows

edit: this but more abstract (also i'm very sorry for the bulky read)

mjattiot commented 4 years ago

We, indeed, have the exact same issue. Having a "model-based" generated UI is very important to be very efficient. Like stated by @UltimateForm it's very common to have dynamic objects that have a structure that changes based on business rules. Such objects need to be visualized and edited (forms). We are working for major banks and I can tell you that such GUI is deeply required. We are in the process of choosing new technologies for our frontend team and we would love having react-jsonschema-form implemented (in some way) into react-admin enterprise edition.

gustavorps commented 3 years ago

+1

qianxuanyon commented 2 years ago

Have the same needs

fzaninotto commented 2 years ago

Good news: The Enterprise Edition now contains a <JsonSchemaForm> component that does the integration of react-admin and react-jsonschema-form. It even includes a <ReferenceInput>!

https://marmelab.com/ra-enterprise/modules/ra-form-layout#jsonschemaform

UltimateForm commented 2 years ago

@fzaninotto it's a joy to finally have this included :) good work