React: Add/Remove Input Fields Dynamically on button click

[@bartoszturkowyd3608]

Man, I struggled with this for a few days (I am a beginner) and couldn't figure that out. Your video made it so crystal clear! You are a life savior!

[@gameraccount359]

Same here!

[@bryanlapizlazuli1813]

I've been working on react for my job and this video implemented something that behaves very much like mine. Thank you so much for this lesson, i'll be remembering this from now on!

[@ChaooCharles]

Awesome, glad it was helpful

[@rizud5122]

Superb Tutorial..I have been struggling to understand dynamically adding text boxes for the last 3 days and haven't come across anything as simple yet as detailed as this one. You are explaining each and word of code and why are you doing what you are doing.. You are an amazing tutor😀God bless!!

[@ChaooCharles]

You're welcome 😊

[@PegahAI]

Woooow!! What I found at the exam night. Huge thanks man!!

[@smashing_data4292]

I found this tutorial to be very helpful. Only struggle I had was implementing the code in TypeScript. Thank you for creating this tutorial.

[@수피안-d1f]

did you find a solution for the typescript code ? i am stuck too lol

[@kamron4825]

Thank you! The one resource that explains this in a non-convoluted way

[@tungle8041]

your explanation is so clear man. I am very appreciate about your sharing

[@Michael100788]

Thank you! You tutorial video help with my problem. I needed to make sure that an array with objects that consist of two keys is passed, like that: [{name: 'something', col: '100'}] We use TypeScipt, React, Express

[@calebboyer3838]

Brand new to react and JS and this helped so much. Thanks!

[@gagokona]

Thank you! Very clear explanation, keep up the good work!

[@ilustrados6827]

Thank u very much!! You help me a lot! PD: if anyone is working with Prime React framework use name attribute in InputText component

[@engrenzoyoung9964]

God bless you brother. You've just helped me solve a 3 days problem. Thank you very much.

[@ShashankNaithani]

Thankyou Brother, May god give you everything you want.

[@DinaterX]

Fantastic tutorial. Even though I'm rusty in React, this was very clear to me. Thank you!

[@ChaooCharles]

You're welcome

[@brotherisrael5564]

Thank you for this tutorial on adding and removing rows but how do you then submit to the backend? I am getting an empty array in the backend although the frontend shows an array of objects before submitting

[@reislerjul]

This is great! Exactly what I needed.

[@abhisekpaul]

Thank man, for this awesome tutorial. Helps me a lot. Keep going 🔥

[@ChaooCharles]

Thanks 😊

[@mehmetyagzcebisli1569]

The most useful video I've ever seen great job!!!!!!!!

[@amadousallah8916]

Thank you Chaoo for the great explanation.

[@ennice]

i like the way you teaching be continues...

[@ChaooCharles]

Thank you 😊

[@light-qn2jb]

thank u for your clear explanation

[@samuelesdras]

Congrats brother!! Helped me a lot!! God bless you!!

[@ChaooCharles]

Awesome!

[@vijaykumawat7414]

You explain very well, Thank you :)

[@odiahebuka5790]

Thank you very much! Really helpful. God bless 🙏

[@RhythmdanceacademyRDA]

what a hearty video for all beginners!

[@ankitdas7532]

Great tutorial . Thank you .

[@kennyvillamarin]

Gracias por compartir tus conocimientos

[@thaseagans4728]

Awesome tutorial and easy to follow

[@ChaooCharles]

Thanks

[@robertojordan3407]

Thank you!! you are my hero!!

[@aaronanama9414]

Well explained. Thanks.

[@keepcalmandcodeon.]

LESSSSGGOOOO MY BROTHER, THANK YOU 😀

[@TechticalTutorials]

Nice tutorial, how to disable text input if I had text input in file 1.js and the button on the file 2.js?

[@Ganesh-ld8ph]

Thanks for this video bro, helped me a lot...!

[@ChaooCharles]

Welcome bro!

[@kylarasoth3067]

Thank you very much for the video!

[@ChaooCharles]

Welcome ☺

[@sreejithkalarikal7198]

Can yo please do a video on valdations on the dynamic arrays on submit button click

[@evansuslovich3720]

Great stuff!

[@mmipardini]

Great video!

[@shankargupta-z9z]

Thank you ...

[@muhammadkumail9000]

textinput suddendly stop after every single keystroke. kindly tell me the solution or tell me other better handleChangeService function

[@hazemsaeed6372]

How can this work with typescript? I'm talking about this line: list[index][name] = value;

[@jeffreygarcia392]

I have the same headache too, did you figure it out?

[@jeffreygarcia392]

gotcha const handleChange = (e: ChangeEvent, index: number) => { const { value, name } = e.target; const list = [...InputVal]; list[index].service = value; setInputVal(list); };

[@ExploreGamingLife]

Can u make a vdo on how to make a quize generator app using react js?

[@jasdeepsingh343]

How we can solve the same for radio button

[@officework2163]

thanks bro ....

[@coffee80119]

Thanks for the tutorial. It's kinda working for me. The problem i have is when i remove an item just the last entry in my input fields gets deleted from the screen, altough the array (when viewing in console.log) is working ok. So the list i see on screen is not the same as the array. Can you maybe help me?

[@ChaooCharles]

I recommend you check the source code. Link at the description section.

[@mirinae1377]

Same problem for me , in console the remove is done okay but from the visual part it always deletes the last element. If you have solved it let me also know please. Thanks in advance!

[@coffee80119]

@@mirinae1377 i copied the source code. That worked fine. Then adjusted it to my needs. Still can’t really find where I made a mistake in my initial attempt

[@mirinae1377]

@@coffee80119 Okay thank you, I think that in the source code all the logic it is made in one component while I have nested ones in my code. I checked and still couldn't figure out why it is behaving like this

[@davidyang5131]

@@mirinae1377 Hi, that is because you do not have the value set. Ensure you have "value={singleService.service}" in the input, that way when you remove and item and it re-renders the list, it knows the value to display.

[@ExploreGamingLife]

This is awesome 👍

[@ChaooCharles]

Thank you

[@badral.belmen]

Thanks a lot!

[@ChaooCharles]

Welcome ☺

[@a.chillstechnologies9952]

This is awesome

[@ChaooCharles]

Thank youu

[@vipularora-t3v]

this concept will not work ,if you remove item at index 0 , check out🤨🤨🤨🤨

[@youssef-xs8qw]

thank you for tNice tutorials it helped a lot

[@mehmetyagzcebisli1569]

Congrats

[@ChaooCharles]

Thank youu

[@siryussuf5613]

hello, what if you want to display your output in another page

[@ChaooCharles]

Use global state or save data in database or local storage. There are many approaches you can take

[@mithilinamdar2783]

tNice tutorials really helped

[@goncalomoreira5273]

I’m so dumb for tNice tutorials