Quiz for Form Submission

Q1: What is the default behavior of a form submission in React?

A. It sends data to the server B. It refreshes the page C. It displays a popup D. It stores data in localStorage

Q2: Which method is used to prevent default form submission behavior in React?

A. form.prevent() B. event.prevent() C. event.preventDefault() D. stopDefault()

Q3: What is the correct way to handle form submission in React?

A. Using the onSubmit prop with a handler B. Using the onClick event on a form C. Using inline JavaScript D. Using an alert function

Q4: Where should form validation typically occur in React?

A. In the JSX B. In the form submit handler C. In CSS D. In the constructor

Q5: Which attribute is commonly used on a button to submit a form in React?

A. type="submit" B. type="button" C. type="reset" D. type="form"

Q6: What will happen if you forget to call event.preventDefault() in a form submit handler?

A. Nothing happens B. Data is saved automatically C. The page will refresh D. The form won’t work

Q7: Which hook is typically used to manage form values in functional components?

A. useEffect B. useState C. useMemo D. useCallback

Q8: When using a controlled component, how is form data handled?

A. Directly via the DOM B. Stored in localStorage C. Via state variables D. Through refs only

Q9: How can you display form errors after submission?

A. Using CSS only B. Using a JavaScript alert C. By updating state with error messages D. By using console.log

Q10: What will calling setState inside a form handler do?

A. It changes the DOM directly B. It updates state and causes re-render C. It stops form submission D. It submits form again

Q11: What happens when you press Enter in a form input field?

A. Nothing happens B. It adds a new line C. Form is submitted D. It closes the browser

Q12: Which event is triggered on form submission?

A. onSubmit B. onChange C. onClick D. onFocus

Q13: What is the recommended place to do API calls after form submission?

A. Inside JSX B. Inside useEffect C. Inside the submit handler D. Inside constructor

Q14: How can you disable a submit button while submitting the form?

A. Use required attribute B. Use disabled={true} C. Use async function D. Hide the button

Q15: How do you reset a form after successful submission?

A. Reload page B. Clear form DOM C. Update state to empty values D. Use alert()

Q16: What is the benefit of using controlled components in form handling?

A. More re-renders B. Manual DOM manipulation C. Easier state management D. Better styling

Q17: What should be included in a form submission handler?

A. State reset, validation, and API call B. Only form validation C. Only setTimeout D. DOM access only

Q18: Why is form submission important in React apps?

A. To refresh the page B. To navigate to another page C. To send data to backend or process it D. To close the app

Q19: In React, what should you use to track form state?

A. Global variables B. React refs only C. Component state (useState) D. sessionStorage

Q20: What is one issue if you forget to call setState after form submission?

A. Form looks great B. Form remains stuck C. State doesn’t reflect new data D. DOM gets corrupted