How to change the attribute of an element and actually make changes to the virtual DOM?
Unanswered
Greater Flamingo posted this in #help-forum
Greater FlamingoOP
I was giving an interview and the interviewer asked me to write a code where I can make changes from the browser console.
So like, I want to add any value in the inputs but I have to make sure that the handleSubmit always fires, invalidating the logic for the disabled attribute
The interview is over but I am wondering if its even possible.
I know the question is more related to react but I was asked to do it in a next app
const [inputNumber, setInputNumber] = useState<number>(0)
const [inputNumber2, setInputNumber2] = useState<number>(0)
const handleSubmit = () => {
alert(
'First Number = ' + inputNumber + ' Second Number = ' + inputNumber2
)
}
return (
<div className='grid place-content-center h-screen w-screen gap-4'>
<input
type='number'
className='text-black'
onChange={(e) => setInputNumber(Number(e.target.value))}
value={inputNumber}
/>
<input
type='number'
className='text-black'
onChange={(e) => setInputNumber2(Number(e.target.value))}
value={inputNumber2}
/>
<button
className='bg-blue-400 hover:bg-blue-600 duration-200 disabled:bg-blue-400'
disabled={!(inputNumber + inputNumber2 === 10)}
onClick={handleSubmit}
>
Submit
</button>
</div>So like, I want to add any value in the inputs but I have to make sure that the handleSubmit always fires, invalidating the logic for the disabled attribute
The interview is over but I am wondering if its even possible.
I know the question is more related to react but I was asked to do it in a next app