<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" > <channel><title>Comments on: Dynamically Add/Remove rows in HTML table using JavaScript</title> <atom:link href="http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/feed" rel="self" type="application/rss+xml" /><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html</link> <description>Tutorials, Java, J2EE, Struts, AJAX, JavaScript, CSS, Web 2.0, MySQL, Articles</description> <lastBuildDate>Thu, 09 Feb 2012 07:08:35 +0000</lastBuildDate> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3.1</generator> <item><title>By: Abdul Basit</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-25703</link> <dc:creator>Abdul Basit</dc:creator> <pubDate>Sun, 29 Jan 2012 18:22:35 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-25703</guid> <description>Thanks For the help It is very Useful code and working 100% correctlybut some people need change the id and name also for this i make a change in the script  take a look on the codeAdd/Remove dynamic rows in HTML table [code language=&quot;js&quot;] function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var colCount = table.rows[0].cells.length; for(var i=0; i&lt;colCount; i++) { var newcell = row.insertCell(i); newcell.innerHTML = table.rows[0].cells[i].innerHTML; //alert(newcell.childNodes); switch(newcell.childNodes[0].type) { case &quot;text&quot;: newcell.childNodes[0].value = &quot;&quot;; break; case &quot;checkbox&quot;: newcell.childNodes[0].checked = false; break; case &quot;select-one&quot;: newcell.childNodes[0].selectedIndex = 0; break; } } } function deleteRow(tableID) { try { var table = document.getElementById(tableID); var rowCount = table.rows.length; for(var i=0; i&lt;rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox &amp;&amp; true == chkbox.checked) { if(rowCount &lt;= 1) { alert(&quot;Cannot delete all the rows.&quot;); break; } table.deleteRow(i); rowCount--; i--; } } }catch(e) { alert(e); } } [/code] India Germany France United States SwitzerlandThanks</description> <content:encoded><![CDATA[<p>Thanks For the help It is very Useful code and working 100% correctly</p><p>but some people need change the id and name also for this i make a change in the script  take a look on the code</p><p> Add/Remove dynamic rows in HTML table</p><pre class="brush: jscript; title: ; notranslate">
        function addRow(tableID) {

            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

            var colCount = table.rows[0].cells.length;

            for(var i=0; i&amp;lt;colCount; i++) {

                var newcell = row.insertCell(i);

                newcell.innerHTML = table.rows[0].cells[i].innerHTML;
                //alert(newcell.childNodes);
                switch(newcell.childNodes[0].type) {
                    case &amp;quot;text&amp;quot;:
                            newcell.childNodes[0].value = &amp;quot;&amp;quot;;
                            break;
                    case &amp;quot;checkbox&amp;quot;:
                            newcell.childNodes[0].checked = false;
                            break;
                    case &amp;quot;select-one&amp;quot;:
                            newcell.childNodes[0].selectedIndex = 0;
                            break;
                }
            }
        }

        function deleteRow(tableID) {
            try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            for(var i=0; i&amp;lt;rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox &amp;amp;&amp;amp; true == chkbox.checked) {
                    if(rowCount &amp;lt;= 1) {
                        alert(&amp;quot;Cannot delete all the rows.&amp;quot;);
                        break;
                    }
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }

            }
            }catch(e) {
                alert(e);
            }
        }
</pre><p> India<br /> Germany<br /> France<br /> United States<br /> Switzerland</p><p>Thanks</p> ]]></content:encoded> </item> <item><title>By: Riyas</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-25570</link> <dc:creator>Riyas</dc:creator> <pubDate>Thu, 26 Jan 2012 07:49:36 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-25570</guid> <description>Hi Viral,I have multiple rows in a table where each rows contains a delete button and a check box. Now i want to delete particular row when the user checks the checkbox field and click the delete button on that particular row. I tried your code (deleterow(datatable)) but it just delete the selected checkbox row when i used to click delete button on some another row. Please help me out...</description> <content:encoded><![CDATA[<p>Hi Viral,</p><p>I have multiple rows in a table where each rows contains a delete button and a check box. Now i want to delete particular row when the user checks the checkbox field and click the delete button on that particular row. I tried your code (deleterow(datatable)) but it just delete the selected checkbox row when i used to click delete button on some another row. Please help me out&#8230;</p> ]]></content:encoded> </item> <item><title>By: Jeff</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-25455</link> <dc:creator>Jeff</dc:creator> <pubDate>Mon, 23 Jan 2012 20:57:06 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-25455</guid> <description>Thanks for the bit about inserting table rows with Javascript. Super helpful!</description> <content:encoded><![CDATA[<p>Thanks for the bit about inserting table rows with Javascript. Super helpful!</p> ]]></content:encoded> </item> <item><title>By: raghu</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-25126</link> <dc:creator>raghu</dc:creator> <pubDate>Thu, 19 Jan 2012 07:40:11 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-25126</guid> <description>foreach($txtbox as $a =&gt; $b)   echo &quot;$chkbox[$a]  -  $txtbox[$a]  -  $country[$a] &quot;;  code is returning only one row. it is not returing more than one row.any solution ?</description> <content:encoded><![CDATA[<p>foreach($txtbox as $a =&gt; $b)   echo &#8220;$chkbox[$a]  &#8211;  $txtbox[$a]  &#8211;  $country[$a] &#8220;;  code is returning only one row. it is not returing more than one row.</p><p>any solution ?</p> ]]></content:encoded> </item> <item><title>By: ag</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-24689</link> <dc:creator>ag</dc:creator> <pubDate>Mon, 16 Jan 2012 14:44:00 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-24689</guid> <description>this code is great, is there a way to use the checkbox to tell the the &quot;add row&quot; button to insert the new row after the checkbox instead of at the end of the table?</description> <content:encoded><![CDATA[<p>this code is great, is there a way to use the checkbox to tell the the &#8220;add row&#8221; button to insert the new row after the checkbox instead of at the end of the table?</p> ]]></content:encoded> </item> <item><title>By: Viral Patel</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-24630</link> <dc:creator>Viral Patel</dc:creator> <pubDate>Mon, 16 Jan 2012 06:33:53 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-24630</guid> <description>@Harry: I didn&#039;t get you. What do you mean by go back to see it? Also by clicking submit button, the page gets submitted to server side code. So you need to take care of painting the fields back when the page gets reloaded.</description> <content:encoded><![CDATA[<p>@Harry: I didn&#8217;t get you. What do you mean by go back to see it? Also by clicking submit button, the page gets submitted to server side code. So you need to take care of painting the fields back when the page gets reloaded.</p> ]]></content:encoded> </item> <item><title>By: harry</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-24538</link> <dc:creator>harry</dc:creator> <pubDate>Sun, 15 Jan 2012 13:40:55 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-24538</guid> <description>hi viral i m having the problem with this code when i click on addrow button a row is added but i have to go back to see it .and on clicking any other button (say submit) these are deleted .please help me .its urgent.</description> <content:encoded><![CDATA[<p>hi viral<br /> i m having the problem with this code when i click on addrow button a row is added but i have to go back to see it .and on clicking any other button (say submit) these are deleted .please help me .its urgent.</p> ]]></content:encoded> </item> <item><title>By: Jagan</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-24407</link> <dc:creator>Jagan</dc:creator> <pubDate>Sat, 14 Jan 2012 11:08:10 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-24407</guid> <description>thanks a million for the code</description> <content:encoded><![CDATA[<p>thanks a million for the code</p> ]]></content:encoded> </item> <item><title>By: sumi</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-24321</link> <dc:creator>sumi</dc:creator> <pubDate>Fri, 13 Jan 2012 19:18:37 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-24321</guid> <description>hi viral,thanks for the useful code.I would like to add header row for each column. can you help me how to add it?</description> <content:encoded><![CDATA[<p>hi viral,</p><p>thanks for the useful code.</p><p>I would like to add header row for each column. can you help me how to add it?</p> ]]></content:encoded> </item> <item><title>By: rajalakshmi</title><link>http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html-table-using-javascript.html/comment-page-5#comment-22701</link> <dc:creator>rajalakshmi</dc:creator> <pubDate>Sat, 07 Jan 2012 07:29:40 +0000</pubDate> <guid isPermaLink="false">http://viralpatel.net/blogs/?p=979#comment-22701</guid> <description>How To Add/Remove rows from table having Drop Down List, that have the values retrieving from database</description> <content:encoded><![CDATA[<p>How To Add/Remove rows from table having Drop Down List, that have the values retrieving from database</p> ]]></content:encoded> </item> </channel> </rss>
<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced

Served from: viralpatel.net @ 2012-02-09 14:13:37 -->
