All Questions
2,985 questions
0
votes
2
answers
35
views
How can I set form submit button to disabled until form is empty using useActionState hook?
I have a form in a React app. I am using the useActionState hook to manage form status. How can I set the submit button to disabled until the user enters something in the text input?
By using the ...
- 23
0
votes
0
answers
12
views
RevalidatePath only fires once in server side action
So, I am very new to NextJS and I was building an app where a user can sign in and perform CRUD operations relative to the user or even the user himself.
The architecture I was following (and I don't ...
- 133
0
votes
1
answer
37
views
Using server action useActionState hook in Nextjs
I have a sign in form that is calling a server action and I'm using useActionState to handle the state of the form but I am getting a typescript error
Argument of type '(state: SignInFormInitialState, ...
0
votes
1
answer
16
views
How to clear form inputs in React after submission
I'm submitting data from my form to my email using emailjs service. However when i remove event.preventDefault() function in the formhandler function, no message or mail is sent to my email while the ...
- 59
0
votes
0
answers
20
views
React - multiple form fields dependent button enabling
My React web app has the below layout in a page:
a. Common ��Info” section (form) at the upper half.
b. Say 4 different “Details” tabs in the lower half. (Also forms)
Now I have a button in a. that ...
- 1
0
votes
0
answers
33
views
useState vs useRef in terms of performance in React multi-input forms [duplicate]
When a state changes for one of the inputs, the whole page is not "rerendered", just that input field, right ? Would useRef give faster performance because there are no renders besides the ...
0
votes
1
answer
60
views
React: “key” Prop Being Spread into JSX Using getInputProps from @conform-to/react
I am encountering an issue where React complains about a key prop being spread into a JSX element, even though I’m not explicitly passing it as part of my props.
Here’s the relevant code snippet:
<...
- 3,228
0
votes
0
answers
36
views
React 19's new form action function doesn't append file object to its formData parameter object
I am building an app with nextjs 15 where react 19 has been incorporated. So, I wanted to use the new formAction way in form which is basically you put a function like ''. I have also added shadcn ...
- 165
0
votes
1
answer
20
views
Next.JS/React form, order of execution issue
While working on a Next.JS web app, I have an issue concerning the execution of some code.
The relevant TSX code follows:
"use client";
import {useState,ChangeEvent} from 'react';
import {...
- 11.7k
0
votes
0
answers
32
views
JS Conflict Between Custom Widget and Form Calendar Element
I made a widget to add a custom question to the source code from a form created by a drag and drop form builder (jotform) and it works inside a simple form.
However, when I add a jotform calendar ...
- 417
0
votes
0
answers
140
views
Next.js 15 Client and Server Side Validation With Mantine Form and Server Actions
I am using Mantine form for my UI and client side validation: https://mantine.dev/form/validation/
Here is an example of using it:
import { useForm } from '@mantine/form';
import { NumberInput, ...
- 591
0
votes
1
answer
32
views
How to prevent text flicker during input-to-span transition animation tailwind react
I'm implementing an expandable input field that transforms into a span when losing focus. The input expands on focus and shrinks when converting back to a span. While the width animation works ...
- 431
-1
votes
0
answers
35
views
Handling server answer with a form (Next.JS/React)
I am working on a Next.JS app and I need a bit of help.
To make a very simple login system, I have the React component hereafter :
.....
const Login = () => {
return(
<form className=&...
- 11.7k
2
votes
2
answers
359
views
How to prevent Form Field Reset on Validation Error When Using useActionState and Zod Validation in React 19/Next.js 15
I'm working with React 19 and Next.js 15. I want to create a form that lets users update the payment amount and currency. Each currency has a different maximum payment limit, and if a user enters a ...
- 1,200
0
votes
0
answers
52
views
React hook form - Handling default non string values with controlled inputs
I'm trying to create simple form with numeric input with controlled inputs but I'm facing an issue with React Hook Form + Yup.
What I'm trying to achieve is a simple number input, with no value at ...
- 21