Comments (5)
OK, I see the error of my ways here. The widget doesn't render the <label>
, it only renders the input. The label is rendered as well as whatever I supply for ui:widget
. I guess the id
question remains, even though my example no longer makes sense. My example does raise a different question, how I could replace a whole component, including the label, but that's for a separate issue...
from react-jsonschema-form.
I'm surprised your code snippet works; JSX requires to have a single root element, so you should use something like this:
'ui:widget': (props) ->
<div><input type="checkbox" id="ID"/><label htmlFor="ID">I agree</label></div>
Note that wrapping the input within the label would prevent duplicating the id information while keeping clicks on the label activating the input:
'ui:widget': (props) ->
<label><input type="checkbox" id="ID"/>I agree</label>
For unique id generation, the issue is probably to persist them along the entire lifecycle of the component, so that means persisting this in comp state, or keeping a whole tree of nested ids in root component state.
To be noted, maybe #45 would help achieving what you're after here.
Also, we don't have identified use cases for this in our current projects using this lib; so would you be willing to work on implementing this?
from react-jsonschema-form.
I'm trying to use a stateless widget (...) I could hope the component only loaded once (ouch)
Stateless components are indeed fully rendered every time they receive props. If you want to "initialize" a component, eg with something generated once attached to it, you need state, hence you can't use stateless components.
from react-jsonschema-form.
We now have generated unique ids for form widgets (docs).
from react-jsonschema-form.
@n1k0 Yet more awesomeness from y'all. Thanks.
from react-jsonschema-form.
Related Issues (20)
- DOCUMENTATION Issue: Wrong method signature? HOT 1
- Schema defines standalone checkbox as mandatory, but asterisk is not rendered. HOT 2
- I would like to make a default change to the look of all input fields HOT 5
- Adding required field in nested if/then/else not working correctly HOT 2
- FormData is not received based on schema properties HOT 1
- Select bug when multiple oneOf are nested HOT 2
- How can I cite this? HOT 6
- RJSF anyOf customization HOT 3
- Validation error when multiple $ref references point to a single definition HOT 3
- not working about validation HOT 3
- Passing ui options down to array items HOT 3
- MUI number input label UI issue with non-numeric input HOT 1
- Publish v6 release candidate with support for Bootstrap 5 HOT 1
- Can not replace "integer" widget HOT 4
- Omit Extra Data not behaving as expected on submit for allOf (if then) schemas along with additionalProperties set to false blocking form submission HOT 1
- `anyOf` form validation error messages confusing when `anyOf` items contain properties found in other items HOT 4
- How to reference an array field from an enum field?
- Array Length dependant on FormContext Value
- Add support for tremor UI library
- Issue with data of files array when we have validation required and minItems HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-jsonschema-form.