Questions tagged [controlled-component]
89 questions
0
votes
2 answers
What can happen if I don't declare a controlled component?
import React, { useState } from "react";
function App() {
const [fName, setfName] = useState("");
function changefName(event) {
setfName(event.target.value);
}
return (
Hello {fName} …
chu-js
- 181
- 7
0
votes
0 answers
Custom textarea objects in React with controlled contentEditable
I'm trying to create a textarea where on enter the input is converted to a custom component (e.g. email) as show below. Any suggestions on how to create this in react?
I have tried creating this using a contentEditable div with the values being…
0
votes
1 answer
Changing input of controlled component changes property value to undefined
I have an array of default values in a useState. Upon an onChange event via a select, the properties in the array are changed to undefined. I've been reading up on controlled components and I think I've missed something silly.
Here is a…
paq
- 87
- 8
0
votes
1 answer
Change the input initial value of controlled component in React
I have this input component
const FOO = props => {
const [inputValue, setInputValue] = useState(
props.editState ? props.initialValue : ""
);
const setSearchQuery = (value) => {
setInputValue(value);
props.onSearch(value);
…
eksoo
- 81
- 1
- 6
0
votes
1 answer
Having problem with controlled form validation in Reactjs
Hi i'm newbie learning to code and start with Js, Reactjs. I convert my code from class component to functional component and then my validation stop working. i have looking around but yet to find answer, can someone help? ^^"
export default…
Kisei
- 1
- 1
0
votes
1 answer
Checking one checkbox in a group, controlled component Typescript and React
all.
I have a controlled component I am building in Storybook using React and Typescript.
As an uncontrolled component my Checkbox works fine.
I am a little stuck with my thought process and logic with it being controlled and with multiple…
Zack Amin
- 514
- 4
- 12
0
votes
1 answer
how to solve "TypeError: Cannot read properties of undefined (reading 'state') at checkGuess (Flashcard.js:34:1)" when trying to post form data?
I have a simple react flashcard app that sends data to the backend about the flashcard including the question, answer choices, and the answer that the user guessed along with the correct answer. I am trying to post the user's name that they enter…
sleepysanjay
- 37
- 1
- 5
0
votes
1 answer
How to get the values from
I have a form that has a select-multiple field. It is just getting one value that is first clicked but not the other values that are clicked after clicking the first one. Hhow to get the values? Below is my code.
assignment of state, Here shift and…
Ritankar Bhattacharjee
- 639
- 1
- 6
- 25
0
votes
1 answer
Listen for Change ONLY ONCE on a React Controlled Input
I am attempting to emit a socket event on user input but I want the event to be emitted ONLY ONCE when the value of the input changes in state and another event to be emitted ONCE when the value is cleared.
const [text, setText] =…
Quatban Taco
- 310
- 1
- 15
0
votes
1 answer
Laggy TextField Updates in React
I'm relatively new to react and am having a little trouble understanding passing props/states from a child to parent component. I've managed to implement something that works but it is extremely laggy.
Overview: I am trying to create a form with…
dfwgwefewfwe
- 31
- 7
0
votes
1 answer
having controlled and uncontrolled input fields in the same component is prevent the submission of form
I have searched in all the answers provided on google for this question but still, I can not find out the solution myself.
I have a parent state that holds the bdate string and session array, those elements take their values from the input field and…
Noha derwa
- 111
- 10
0
votes
1 answer
How to display an unordered list into a JSX element in a React Form using class component
I'd like to write an unordered list compiled from a form's input values into a
- when I click on the Submit button. It's a controlled form in a class based component. Unfortunately I haven't found out how I can achieve it without hooks.
export…
Koppanyi
- 1
- 2
0
votes
1 answer
ReactJS:Input on controlled component doesn't change state
I have an object literal with some empty values that I want to change according to a list of inputs. The problem is that, though the value of the input is updated with a predefined value in useEffect(), I can't change the input with the onChange…
Icarus23
- 167
- 2
- 11
0
votes
1 answer
React radio button requires two clicks to render
I'm controlling a Radio button on a react form.
The state is updating on change as expected, but the checked value isn't being rerendered on change. Therefore, from a user perspective the button isn't working.
I've replicated this in a codesandbox…
Peantor
- 3
- 3
0
votes
2 answers
Can I programmatically update the values of React bootstrap after it's been updated?
Is it possible to update the value of a React Bootstrap after it's been edited by a user?
I've created a small Bootstrap form in React with four controlled fields. Details are below. Submission works, but I'd like a way to update the…
RyeGrain
- 61
- 6