Stack Overflow
Stack Overflow

Questions tagged [use-form]

64 questions
3
votes
0 answers

Getting errors using mantine useForm APIs like insertListItem

Hello everyone I am facing some issues regarding using MantineUI. I am trying to crate a form with some nested values. So, I am trying to use the mantine useForm hook, but when I run the sample code provided in the mantine docs its failing on my…
Yash Patel
  • 31
  • 1
3
votes
1 answer

How to set a input field based on other inputs in react-hook-form

I have FirstName and LastName input Fields. I have a read only field called FullName which will have value based on FirstName and LastName. What ever is typed in the first name and last name input fields the Fullname will be Firstname + LastName. I…
Joy
  • 105
  • 1
  • 2
  • 10
3
votes
2 answers

React useForm get value from TextBox

I am using React useForm hook to submit data from my form. The requirement is the user should see the sample data in a preview div before he submits. How can i get the value from input text boxes and display it in a div next to the input. In the…
Joy
  • 105
  • 1
  • 2
  • 10
2
votes
1 answer

How to set API Data in react hook form

I have this input field. I am using this input to submit the data for adding new record on server. Now when user wants to edit the data I have to show the API data in this field. How to achieve this? const { register, handleSubmit, formState:…
Andaman
  • 295
  • 3
  • 10
2
votes
1 answer

useForm in React: formState.isDirty is true, but .dirtyFields is empty

I have a React JS form using useForm library. This is a popular library so I'm not sure this can be a bug but I'm getting into a state which seems incorrect. See the screenshot of the console in chrome below: How can I have formState.isDirty, but…
ConfusedNoob
  • 9,826
  • 14
  • 64
  • 85
2
votes
1 answer

how to pass value to Yup?

I use useForm, but I don't think it matters. I want dependence on isAdmin to validate fields: paymentMethod, otherPaymentMethod. I tried with context: { isAdmin: true } and to get it in transform((value) => { console.log(value); }) but nothing. How…
Sweet Caramel
  • 206
  • 2
  • 11
2
votes
1 answer

How to set array in useForm and validate the length of value?

I'm using react-hook-form. What I wanna do is to push a value to an array and validate the length of value. This is defaultValue. defaultValues: { title: '', role: '', language: {source: '', target: []}, industry: '', …
Ga Yeon Kim
  • 91
  • 2
  • 6
1
vote
0 answers

The form is getting submitted after setting custom error with setError function in useForm hook

// ** React Imports import { FocusEvent, useEffect } from 'react' // ** MUI Imports import Box from '@mui/material/Box' import Button from '@mui/material/Button' import Dialog from '@mui/material/Dialog' import DialogActions from…
Biplab Paul
  • 13
  • 3
1
vote
0 answers

Unable to type anything in the Text Input field while using two React hook forms in a single component

So, I am trying to create Registration and Login form separated by only a toggle switch inside a card and for that I declared two different useForm() instances. const {control, handleSubmit, formState: { errors }, reset, getValues} = useForm({ …
22nd_wallflower
  • 11
  • 1
1
vote
1 answer

How to prevent loading blank page after submitting form?

I have an issue with reloading a blank page after submitting a contact form. Contact form is working, email is sending to me but after that itself loading a blank page. I would prefer it to act like this: submiting a form -> sending an message ->…
Mikołaj Wittbrodt
  • 399
  • 1
  • 4
  • 18
1
vote
0 answers

React doesn't detect that an input had been filled

I am using some code with fields that are "required", the confirm button will not activate while they are empty. When someone else types something in the field while running it on their computer the button activates as intended, but if I do it on my…
TurtleTail
  • 163
  • 6
1
vote
0 answers

how to use DateTimePicker (MUI) with YupValidation and restrict startdate to come after enddate and enddate come before startdate?

This is my Current code: import { useForm, Controller } from "react-hook-form"; import { yupResolver } from "@hookform/resolvers/yup"; import { DateTimePicker } from "@mui/x-date-pickers"; const schema = Yup.object({ startDate:…
MR.T
  • 11
  • 2
1
vote
1 answer

why does handleSubmit in react hook useform is not being called

I am using useform hook but the handlesubmit function is not being called . here is the code: This is the useform hook i am using const { register, handleSubmit, formState: { errors }, watch, reset, } =…
Isra_Yas
  • 33
  • 3
1
vote
1 answer

react testing library, trying to test useForm validation messages

I am trying to write a RTL test for my validations on my form. I am using useForm hook with Yup fro my validations. The scenario i want to test is when user clicks the Add button that submits the from without filling in all the required fields…
John
  • 1,595
  • 4
  • 21
  • 44
1
vote
1 answer

Why is my error message not showing up when I click enter?

I'm trying to have an error message pop up if the user submits an email without inputting a recipient, however, nothing happens upon clicking enter. Is there something I'm missing? pls help import React from "react"; import "./SendMail.css"; import…
casual Ray
  • 11
  • 2
1
2 3 4 5