Quiz for Handling Input Fields

Q1: What attribute is used to bind input value in a controlled component?

A. value B. bind C. model D. ref

Q2: Which event is commonly used to update the state when user types in an input box?

A. onChange B. onClick C. onType D. onInput

Q3: Which hook is commonly used to manage form field values in React functional components?

A. useState B. useEffect C. useContext D. useReducer

Q4: What is the role of the "name" attribute in form input fields?

A. Identifies the input in the DOM B. Used in styling input C. Binds to onClick D. Creates ref automatically

Q5: What happens if you don’t provide an onChange handler for an input with value?

A. It becomes read-only B. It throws error C. It resets value D. It binds automatically

Q6: How can you prevent default form submission in React?

A. e.preventDefault() B. form.prevent() C. return false D. stopSubmit()

Q7: What is required to make an input controlled?

A. value and onChange B. ref only C. placeholder only D. readonly

Q8: Which of the following is best practice for multiple input fields?

A. Use a single state object B. Use multiple state hooks C. Use localStorage D. Use global variable

Q9: Which is the correct way to extract value from input event?

A. e.target.value B. e.value C. e.src.value D. e.data.value

Q10: How do you bind the "checked" property of a checkbox input?

A. checked={stateValue} B. value={stateValue} C. bind={stateValue} D. input={stateValue}

Q11: Which HTML element is NOT used with text input in React?

A. <input> B. <textarea> C. <select> D. <image>

Q12: How to reset input fields in a form?

A. Reset state variable B. Reload form C. Set input to null D. Call reset()

Q13: Why use controlled inputs in React?

A. To sync UI with state B. To reduce HTML C. To avoid validation D. To bypass JavaScript

Q14: What will happen if state is not updated on input change?

A. Input will not reflect typed text B. Page will crash C. Error will be thrown D. Input becomes readonly

Q15: How do you manage form state for multiple fields in one state?

A. Use input name to update state B. Use index values C. Use hardcoded keys D. Use JSON.parse()

Q16: What’s the default type of <input> element?

A. text B. button C. checkbox D. radio

Q17: How to initialize form field state?

A. useState with default value B. localStorage.get() C. renderProps() D. ref assignment

Q18: Which property in event object holds input data?

A. target.value B. src.value C. input D. field

Q19: Which is more flexible for validation: controlled or uncontrolled input?

A. Controlled B. Uncontrolled C. Both same D. None

Q20: How can you detect changes in a form field?

A. Using onChange event B. Using window.listener C. Using ref() D. Using document.write()