Limit number of dynamically added Table Rows using JQuery?

You could always simply use a variable for each table to track the number of added rows Or another alternative would be to use jQuery's data() method which allows you to store data in a dom element directly. The click event would find its table, and update the table's data() each time a row is added, and prevent further additions when it reaches the maximum EDIT: Corrected code with check to see if theCount is undefined, and to remove a mis-placed parentheses $('#Clone'). Click(function() { var $btn = $(this).parent(); if($btn.

Closest('table'). Data('theCount') == undefined) { $btn. Closest('table').

Data('theCount', 0) } var currentCount = $btn. Closest('table'). Data('theCount'); if(currentCount Closest('tr').

Clone(true). InsertAfter($btn); $btn. Closest('table').

Data('theCount', currentCount + 1); } }) http://api.jquery.com/data.

You could always simply use a variable for each table to track the number of added rows. Or another alternative would be to use jQuery's data() method which allows you to store data in a dom element directly. The click event would find its table, and update the table's data() each time a row is added, and prevent further additions when it reaches the maximum.

EDIT: Corrected code with check to see if theCount is undefined, and to remove a mis-placed parentheses. $('#Clone'). Click(function() { var $btn = $(this).parent(); if($btn.

Closest('table'). Data('theCount') == undefined) { $btn. Closest('table').

Data('theCount', 0) } var currentCount = $btn. Closest('table'). Data('theCount'); if(currentCount Closest('tr').

Clone(true). InsertAfter($btn); $btn. Closest('table').

Data('theCount', currentCount + 1); } }); http://api.jquery.com/data.

I like the JQuery data method; however the click does not insert a new row. The currentCount is raising an undefiend error. Could it be $(btn)?

– Rob Feb 3 '10 at 18:17 @Rob - I've updated the code to add an if statement to check whether the data element 'theCount' had been defined (and to initialize it to 0 if not). I also had typed $(btn) in one place instead of $btn. Should work now.

– user113716 Feb 3 '10 at 18:59 I have a textbox which is validated with jquery. Validate plugin. The textbox in the original row is validated but the cloned row is not?

Do you know how I can get the plugin to work on the cloned textbox or other inputs? – Rob Feb 17 '10 at 18:43 @Rob - I'm not too familiar with the validate plugin. Probably best to start a new question and ask why cloned form elements aren't getting validated.

– user113716 Feb 17 '10 at 21:39.

You could just count the number of elements returned. Function countRows() { return $("#table-id tr"). Length + $("#table2-id tr").

Length; // etc, for all table ID's. } Or, you could add a special class to the user-added rows. Function countRows() { return $("tr.

New"). Length; }.

Function addClick(identifier, max){ var I = 0; $(identifier). Click(function() { if (i.

You could also use the data attribute on the table var I = $('#tableID'). Data('userAddedRows');//of course you need to check there is a value and such i++; $('#tableID'). Data('userAddedRows',i); Then just check to make sure the I is less than the amount allowed.

Same problem I am getting with Patrick's snippet. I is undefined. – Rob Feb 3 '10 at 18:26.

Thanks for your assistance but I found a JQuery Plugin that does the trick. It is here... cloudgen.w0ng.hk/jquery/table.addrow.php.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.