Dynamic form using jQuery

Web_Sight
Web_Sight used Ask the Experts™
on
Hi,
Currently I'am creating a form dynamically. I have button named "Add Column" whenever user clicks this button I need to create a drop down. Currently it adds the drop down as the last item. I am looking for when a user clicks "Add Column" in row 2, drop down should be appended at position 3 as well as if a row already exists at position no. 3 it should move on to row 4 and so on.
I have attached the screen shot.
problem.jpg
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Hi,

what do you mean by "Currently it adds the drop down as the last item." It seems that this is what you want to do.

Author

Commented:
The scenario you have mentioned will occur if the last button is clicked. What we want is if the user clicks the "Add Column" button in between we want to generate the drop down just below the clicked "Add Column" button.
When you click the "Add column" button, catch its parent <tr> element.
Then you may insert a new <tr> by using jQuery's .after() method, which will insert the new <tr> after the parent <tr>.

Author

Commented:
Hi matthew016,

Thanks for your reply .We will be looking on to that.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial