Questions tagged [controlled-component]
89 questions
1
vote
1 answer
I want something between a controlled and an uncontrolled component in React
I have an input field in React.
(e.keyCode === 13) ? onAnswer(e.target.value) : false }
/>
This way it behaves just like I need it to behave:
If there…
Daniel Tahin
- 23
- 4
1
vote
1 answer
$emit doesn't trigger parent component VueJs with TypeScript
I'm building a controlled component (one component is a parent and the other one is a child).
Parent component is SurveyContainer and child is SurveyPage1.
In SurveyContainer I have a model object surveyModel and nested object…
Taras Kryvko
- 177
- 1
- 9
1
vote
1 answer
Is this a controlled or uncontrolled React component?
I read the answers on this question but none is similar to my set up:
What are controlled components and uncontrolled components?
I have a parent component and many children as inputs. Each input has a defaultValue that is set using a prop received…
Paul Razvan Berg
- 16,949
- 9
- 76
- 114
1
vote
1 answer
A component is changing a controlled input of type text to be uncontrolled - ReactJS
I have a page where i fetch data from server and setting value in state for controlled inputs. (e.g I have input which has value of this.state.name, i fetch name from server for example Dave and set it in state as name, so value of input is Dave. it…
iLiA
- 3,053
- 4
- 23
- 45
1
vote
1 answer
How to use DataSearch as controlled component from Reactivesearch?
I'm new to ReactiveSearch library, and I implemented the DataSearch component with autosuggestion as my in-site SearchBar. I added value and onChange to in order to store the input value as a state, but as soon as I added the value prop, I can't…
Chloe Sun
- 111
- 1
- 6
0
votes
0 answers
controlled input value is not changing when the state change but change when using useRef hook
i am looping on array of object and each one should be a div with input
formInputs={[
{
title: "الأسم",
name: "name",
required: true,
state: productName,
setState: setProductName,
type:…
0
votes
1 answer
A component is changing an uncontrolled input to be controlled, using Formik
i have this form using Formik, Yup and NextUi v2 Inputs and when i type in one of the imputs this warning comes out in the console
A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from…
Andrés Marino
- 7
- 3
0
votes
0 answers
How to use chadcn's controlled Input component in a form with dynamic data?
Im using https://ui.shadcn.com/docs/components/form components for my nextjs13 app. I want to either dynamically set the input fields value to the edited goal or when I click the "add" button to type a value in the field.
Currently this works fine…
0mppu
- 25
- 1
- 4
0
votes
1 answer
React Form controlled component inputs
I have the following component hierarchy:
App
|
|------|
Results Form
So the Results and Form components are children of the App component. I am trying to implement controlled inputs in the Form. I have my state in the App component…
Daniel Evans
- 65
- 3
0
votes
0 answers
File type input is giving error in ReactJS?
I am using file type input in ReactJS to take image file from the user.
The state that I'm using to store it is give below.
const [frSignUpData, setFrSignUpData] = useState({
name: '',
email: '',
img: '',
})
and input field…
Sagar Sharma
- 5
- 6
0
votes
0 answers
React controlled component not resetting to an empty string
I have a component from Material UI that's supposed to allow a user to choose a numerical value. The field is for use on a medical product so we cannot have a default value that's displayed; rather, the value is initially an empty string…
Eric Hasegawa
- 169
- 1
- 14
0
votes
1 answer
TypeError: Cannot read properties of null (reading 'name') for [event.target.name]: event.targe.value
I'm creating a simple controlled component form in react. When I console log event.target.name on onChange event it logs fine but when I setState using computed property name of the object in javascript it gives me an error TypeError: Cannot read…
Nishant Kumar
- 691
- 1
- 11
- 31
0
votes
1 answer
React - Controlled input props are outdated in useCallback
I have a controlled input where its value and onChange event are set via props. When the selectedValue prop changes, onInputChanged callback gets triggered, but if I try accessing selectedValue in this callback it's out of date.
Seems like when…
user2514324
- 51
- 2
0
votes
0 answers
Why react js application showing me warming about changing your component from controllled to uncontrolled?
My Code is this shown below.....
const navigate = useNavigate()
const [show, setShow] = useState(false);
const [values, setValues] = useState({
email: "",
otp: ""
})
const [error, setError] = useState({
…
0
votes
2 answers
Can't change the value inside input
I'm trying to change the values inside inputs. I got those values from the db.
But it doesn't allow me to type or edit the value.
I've added an handleInputChange function to put inside onChange inside each input tag but it didn't work.
I need those…
lsokol
- 15
- 4