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

Add name attributes to form elements without specifying a custom widget, ability to do a normal form POST

Open ashkanjj opened this issue 8 years ago • 8 comments
trafficstars

Prerequisites

  • [x] I have read the documentation;
  • [x] In the case of a bug report, I understand that providing a SSCCE example is tremendously useful to the maintainers.

Description

Thanks to all the maintainers for this comprehensive and extremely customisable plugin. I'm trying to add a name attribute to a form input by specifying it in the schema. This is so that the server can recognise the form elements.

My question is, is there an easy way to do this without adding a custom widget, which is what i'm doing at the moment?

Steps to Reproduce

This is not a bug but I'm providing an example just to showcase my question https://jsfiddle.net/h4jdraov/. In the properties schema related to the title field you can see a name property however this doesn't add the relevant attribute to the form element.

Version

0.49.0

ashkanjj avatar Jul 31 '17 10:07 ashkanjj

This is a requirement for me, so until this feature (no-js support) is implemented I’ll use a custom implementation instead of this library :(

mariuslundgard avatar Oct 03 '17 10:10 mariuslundgard

Hi @ashkanjj, sorry for not responding to your issue for a while. I don't think there's a strong reason why we couldn't add a name field to each field. I'd be happy to review a PR. @mariuslundgard, calling it "no-js support" is a little strange, since the whole form won't work if you don't have JS enabled.

glasserc avatar Oct 06 '17 14:10 glasserc

I did a quick test to try and get this working a little while ago, and it's relatively simple. I am also targeting graceful degradation for users without Javascript (server-side rendering makes it possible!), so the biggest question I ran into was how to handle things like array fields.

joshourisman avatar Oct 06 '17 16:10 joshourisman

Yes, it can be challenging because you have to support deleting any entry, as well as inserting new ones in any location, as well as rearranging the order. You can refer to entries in an array using their index, but that is vulnerable to race conditions if two browsers are modifying the same array. Maybe one approach would be to take a hash of the contents of each array entry and use that as the name, so that you could at least match up old entries to new entries? I guess you would need a fair amount of server-side code to manage the different possible requests?

glasserc avatar Oct 09 '17 16:10 glasserc

This also would make testing things a bit easier using react-testing-library the way it is suggested here https://testing-library.com/docs/ecosystem-react-select-event. Is there any work on a branch somewhere I could reference? @glasserc I may explore this a bit but I'm guessing it's pretty difficult considering this has been open a while 🤷‍♂

sambigelow avatar Sep 05 '19 17:09 sambigelow

#1283 added a pathSchema which could be used to assign name attributes to inputs.

epicfaace avatar Sep 05 '19 18:09 epicfaace

It would be helpful if you can point me to any reference to any example of pathSchema?

eyesmoker avatar Sep 14 '19 05:09 eyesmoker

@eyesmoker it's generated in the toPathSchema function in utils: https://github.com/rjsf-team/react-jsonschema-form/blob/e673a9097e587f28ffe7d82647ff70ba33908bcb/packages/core/src/utils.js#L986

To fix this issue, we would probably need to run toPathSchema and store the pathSchema in the state of the <Form> component, then pass it on to widgets/fields as needed.

epicfaace avatar Dec 18 '19 05:12 epicfaace