Adding input tags dynamically with jQuery

Question

I am taking the amount from one input box and creating a for...each loop to add input boxes. But I have run into a problem. I tried using append() and html() - append() keeps adding more boxes than needed and html() only adds the last one. Which are both correct. But I need the input boxes to be exactly what the amount is. And if the input box changes again, I need it to re update.

here is the jsfiddle: http://jsfiddle.net/liveandream/mRY3d/

I hope this makes sense... and hopefully someone can help me!! Thanks in advance..

I entered 4 in your jsFiddle and saw 2 sets of inputs show up. Isn't that what should show up? I'm not sure I understand what your problem is then. — David Hoerster
– David Hoerster, Commented Mar 30, 2012 at 22:46
If you change the number of children, it's appending a whole new set of boxes instead of replacing the old ones. — jmoerdyk
– jmoerdyk, Commented Mar 30, 2012 at 22:56
Please have a look at my solution and see if it fits your needs better. Thanks! — iambriansreed
– iambriansreed, Commented Mar 31, 2012 at 3:32

jmoerdyk · Accepted Answer · 2012-03-30 22:53:32Z

1

You probably want to add:

$('.extrakids').empty();

Right before your for loop;

answered Mar 30, 2012 at 22:53

jmoerdyk

5,5468 gold badges43 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

iambriansreed · Accepted Answer · 2012-03-31 02:54:49Z

0

http://jsfiddle.net/iambriansreed/mRY3d/22/

My answer solves a lot of issues.

If you add or remove children you don't overwrite boxes and lose any data put in those boxes.

The update is timed out so if a user slips the JS loop won't crash if it tries to make too many. I maxed out the children created as well.

I left the html where it belonged and created the inputs from it.

And I fixed the original issue.

answered Mar 31, 2012 at 2:54

iambriansreed

22.3k6 gold badges66 silver badges81 bronze badges

Collectives™ on Stack Overflow

Adding input tags dynamically with jQuery

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related