Adding rows dynamically into a table

Question

1.00/5 (1 vote)

See more:

Requirement:
Appending two rows dynamically in a existing table.

Step 1: Initially table contains no rows.

A button named as AddField .
For each button click repeat the following step.

Step 2: two rows added to the table.

How it is possible using javascript.

Please provide a solution in asp.net mvc3.

MyCode:

JavaScript

$('#Field tr').length;//first i take the current number of tr. 
Here 'Field' is my table id.
then using the following code i append one row below the current row.
 $('.AddTableRowForm').append(//Inside this i specified all controls which are added on each row.)

Ouput:
appended one row with specified controls.

Actual Output:
Append two rows below the current row.

Thanks& Regards,
Anupama

Posted 4-Aug-13 19:31pm

AnupamaPillai

Updated 5-Aug-13 0:44am

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

v3

Add a Solution

Comments

Maciej Los 5-Aug-13 2:54am

What have you done so far? Where are you stuck?

AnupamaPillai 5-Aug-13 4:27am

currently i take count of 'tr' and dynamically adding one row on each button click. But my actual requirement is adding two rows on each button click. Is it possible ??

Maciej Los 5-Aug-13 4:33am

If it is possible to add one row, then two is possible too ;)

AnupamaPillai 5-Aug-13 5:23am

No. at a time one row is appended.

Maciej Los 5-Aug-13 5:25am

Please, share your code. Use "Improve question" widget. Shortly describe your issue.

Ankur^\m/ 5-Aug-13 6:48am

Write the append statement 'n' times and it will append n rows.

AnupamaPillai 5-Aug-13 7:20am

if you have time please update code with your logic.... i will apply another logic ....
thanks for your valuable reply 'Ankur'....
I expect this type good logic for future also....

Ankur^\m/ 5-Aug-13 7:23am

Write below statement 2 times and it will append 2 rows:
$('.AddTableRowForm').append(//Inside this i specified all controls which are added on each row.)
Try and let me know.

AnupamaPillai 5-Aug-13 7:32am

thank you Ankur.... it works finee......

Ankur^\m/ 5-Aug-13 7:42am

In that case I will add that as an answer. :)

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Ankur^\m/ · Answer 1 · 2013-08-05T01:47:00

The append statement you are using appends a row to the table. So as many times you write that statement it will append that many rows to your table.
Since in your case you 2 such rows, just write the append statement two times:
$('.AddTableRowForm').append(//Inside this i specified all controls which are added on each row.)
In case the number of appends are large, you could use a for loop to make the code shorter.