Link to home
Start Free TrialLog in
Avatar of Corinne_09
Corinne_09Flag for Canada

asked on

How do you dynamically create a new table using jQuery?

All I know is $("<myTable>").appendTo("#myDiv");

But I want to be able to specify an id for it (which was passed in the function) and then add rows and columns of it with text boxes inside for user input.

I attached an excel file to show what I need.

Thanks for your help.
sample-calcs.xls
Avatar of anoyes
anoyes
Flag of United States of America image

Adding the ID attribute is relatively easy - you should be able to just do $('<myTable>').attr('id','table1').appendTo('#myDiv');

As for adding the rows/columns, it looks like you're doing an order form type deal where they click on a button and it appends a new row to the table.  What I usually do in this situation is to actually create the table and the first row in HTML, and then when the 'Add' button is clicked, it clones the last <tr> element and clears all the user input.  Is that a possible solution, or do you need to whole thing to be dynamically created?
Avatar of Corinne_09

ASKER

I'll need to be creating it dynamically, even the entire table itself. I have it working in Javascript, but I want my code to be cleaner and faster (if possible).
I'm basically creating the tables and the values are retrieved from a database.
I attached another excel file with new additions to it.
sample-calcs.xls
ASKER CERTIFIED SOLUTION
Avatar of anoyes
anoyes
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Thanks. It's a good start. I'll play around with it and I'll get back to you.
Yes, this is working for me and it is a good start. Thanks.