<?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: Adding table rows and columns in JavaScript</title>
	<atom:link href="http://www.redips.net/javascript/adding-table-rows-and-columns/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.redips.net/javascript/adding-table-rows-and-columns/</link>
	<description>Techniques and Web Technologies</description>
	<lastBuildDate>Sat, 04 Feb 2012 16:29:46 +0000</lastBuildDate>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/</generator>
	<item>
		<title>By: dbunic</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4978</link>
		<dc:creator>dbunic</dc:creator>
		<pubDate>Wed, 25 Jan 2012 07:25:42 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4978</guid>
		<description>@selva - If I understood you well, you asked for HTML code of &lt;strong&gt;Add column&lt;/strong&gt; button. No problem, here is source:
&lt;pre class=&quot;brush:text&quot;&gt;
&lt;input type=&quot;button&quot; value=&quot;Add column&quot; onclick=&quot;appendColumn()&quot; class=&quot;append_column&quot;&gt;
&lt;/pre&gt;
As you can see, on button click &lt;strong&gt;appendColumn()&lt;/strong&gt; is called and its source is shown on this page.</description>
		<content:encoded><![CDATA[<p>@selva - If I understood you well, you asked for HTML code of <strong>Add column</strong> button. No problem, here is source:</p>
<pre class="brush:text">
&lt;input type="button" value="Add column" onclick="appendColumn()" class="append_column">
</pre>
<p>As you can see, on button click <strong>appendColumn()</strong> is called and its source is shown on this page.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: selva</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4971</link>
		<dc:creator>selva</dc:creator>
		<pubDate>Tue, 24 Jan 2012 09:56:05 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4971</guid>
		<description>thnk u dbunic i have another doubt . in a html table colums was step by step displayed to on click process using JavaScript
pls give some code example or related url&#039;s</description>
		<content:encoded><![CDATA[<p>thnk u dbunic i have another doubt . in a html table colums was step by step displayed to on click process using JavaScript<br />
pls give some code example or related url's</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: dbunic</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4969</link>
		<dc:creator>dbunic</dc:creator>
		<pubDate>Tue, 24 Jan 2012 08:40:23 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4969</guid>
		<description>@selva - This example shows how to add table row/column (expand/reduce current table). In your case you will have to read column from source table and append (or insert) to the destination table. This should not be complicated and functions from this post can be easily reused for a such purpose.</description>
		<content:encoded><![CDATA[<p>@selva - This example shows how to add table row/column (expand/reduce current table). In your case you will have to read column from source table and append (or insert) to the destination table. This should not be complicated and functions from this post can be easily reused for a such purpose.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: selva</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4966</link>
		<dc:creator>selva</dc:creator>
		<pubDate>Tue, 24 Jan 2012 07:24:20 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4966</guid>
		<description>how to get the colums to another table and insert the colums in using table</description>
		<content:encoded><![CDATA[<p>how to get the colums to another table and insert the colums in using table</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: dbunic</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4710</link>
		<dc:creator>dbunic</dc:creator>
		<pubDate>Mon, 28 Nov 2011 07:21:59 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4710</guid>
		<description>@Jack - In my comment above you can see how to copy content from previous column. In your case, you only need to slightly modify loop. Instead of copying each cell just set value from input box or drop down menu. Something like this:
&lt;pre class=&quot;brush:js&quot;&gt;
// open loop for each row
for (i = 0; i &lt; tbl.rows.length; i++) {
    tbl.rows[i].insertCell(cols);
    // set value from input box
    tbl.rows[i].cells[cols].innerHTML = document.forms[0].myinput.value; 
}
&lt;/pre&gt;</description>
		<content:encoded><![CDATA[<p>@Jack - In my comment above you can see how to copy content from previous column. In your case, you only need to slightly modify loop. Instead of copying each cell just set value from input box or drop down menu. Something like this:</p>
<pre class="brush:js">
// open loop for each row
for (i = 0; i &lt; tbl.rows.length; i++) {
    tbl.rows[i].insertCell(cols);
    // set value from input box
    tbl.rows[i].cells[cols].innerHTML = document.forms[0].myinput.value;
}
</pre>
]]></content:encoded>
	</item>
	<item>
		<title>By: Jack</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4694</link>
		<dc:creator>Jack</dc:creator>
		<pubDate>Tue, 22 Nov 2011 05:24:20 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4694</guid>
		<description>dbunic - thanks for your awesome work. They are very useful. I am new to webpage design and please help me on my project.

I want to have a dynamically table with the capability of adding rows/columns just like above example. A little bit more - all existing content in each cell are retrieved from database. The values for added cells in added column/row are to be either entered or selected from dropdown list like you showed in another example:

&lt;pre class=&quot;brush:js&quot;&gt;
table
drop
down
menu
&lt;/pre&gt;

Thank you...</description>
		<content:encoded><![CDATA[<p>dbunic - thanks for your awesome work. They are very useful. I am new to webpage design and please help me on my project.</p>
<p>I want to have a dynamically table with the capability of adding rows/columns just like above example. A little bit more - all existing content in each cell are retrieved from database. The values for added cells in added column/row are to be either entered or selected from dropdown list like you showed in another example:</p>
<pre class="brush:js">
table
drop
down
menu
</pre>
<p>Thank you...</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: dbunic</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4691</link>
		<dc:creator>dbunic</dc:creator>
		<pubDate>Mon, 21 Nov 2011 16:48:13 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4691</guid>
		<description>@S Valencia - Adding a new column with the same content shouldn&#039;t be a problem. Instead of creating a new table cell, &quot;content copy&quot; will do the magic. Simply open loop for each table row and set reference to the second column (first column contains header so it shouldn&#039;t be used). For each created table cell set &lt;strong&gt;innerHTML&lt;/strong&gt; property the same as is in first column. Here is modified &lt;em&gt;appendColumn()&lt;/em&gt; function:
&lt;pre class=&quot;brush:js&quot;&gt;
function appendColumn() {
    var tbl = document.getElementById(&#039;my_table&#039;), // table reference
        cols = tbl.rows[0].cells.length,           // set number of columns
        i;                                         // loop variable
    // open loop for each row
    for (i = 0; i &lt; tbl.rows.length; i++) {
        tbl.rows[i].insertCell(cols);
        // copy content from first column
        tbl.rows[i].cells[cols].innerHTML = tbl.rows[i].cells[1].innerHTML; 
    }
}
&lt;/pre&gt;</description>
		<content:encoded><![CDATA[<p>@S Valencia - Adding a new column with the same content shouldn't be a problem. Instead of creating a new table cell, "content copy" will do the magic. Simply open loop for each table row and set reference to the second column (first column contains header so it shouldn't be used). For each created table cell set <strong>innerHTML</strong> property the same as is in first column. Here is modified <em>appendColumn()</em> function:</p>
<pre class="brush:js">
function appendColumn() {
    var tbl = document.getElementById('my_table'), // table reference
        cols = tbl.rows[0].cells.length,           // set number of columns
        i;                                         // loop variable
    // open loop for each row
    for (i = 0; i &lt; tbl.rows.length; i++) {
        tbl.rows[i].insertCell(cols);
        // copy content from first column
        tbl.rows[i].cells[cols].innerHTML = tbl.rows[i].cells[1].innerHTML;
    }
}
</pre>
]]></content:encoded>
	</item>
	<item>
		<title>By: S Valencia</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4687</link>
		<dc:creator>S Valencia</dc:creator>
		<pubDate>Mon, 21 Nov 2011 02:44:38 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4687</guid>
		<description>See page www.ContractorInsurance.net/auto_commercial.php

I would like to be able to let the web user have a button that would allow them to add rows or columns depending on how I lay out the form.

For example  in this case the Header is aligned vertically and the Columns should be able to expand or detract. 

I see the code above but the question then becomes...&quot; How do I program the Column to add WITH the content of the one next to it? 

I hope that makes sense...

Ok...to elaborate... You are a business owner that want to purchase auto insurance.

You have twenty drivers...  I would love for you to be able to type in a number or a range of numbers that would allow you enough &quot;columns or rows&quot; to be able to accomadate you. And they can complete the similar request to add vehicles...then submit.  I am using a form to Excel and email php script from Hot Dreamweaver.

Thank you.</description>
		<content:encoded><![CDATA[<p>See page <a href="http://www.ContractorInsurance.net/auto_commercial.php" rel="nofollow">http://www.ContractorInsurance.net/auto_commercial.php</a></p>
<p>I would like to be able to let the web user have a button that would allow them to add rows or columns depending on how I lay out the form.</p>
<p>For example  in this case the Header is aligned vertically and the Columns should be able to expand or detract. </p>
<p>I see the code above but the question then becomes..." How do I program the Column to add WITH the content of the one next to it? </p>
<p>I hope that makes sense...</p>
<p>Ok...to elaborate... You are a business owner that want to purchase auto insurance.</p>
<p>You have twenty drivers...  I would love for you to be able to type in a number or a range of numbers that would allow you enough "columns or rows" to be able to accomadate you. And they can complete the similar request to add vehicles...then submit.  I am using a form to Excel and email php script from Hot Dreamweaver.</p>
<p>Thank you.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: pervez mohammad</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-2/#comment-4567</link>
		<dc:creator>pervez mohammad</dc:creator>
		<pubDate>Thu, 20 Oct 2011 10:27:02 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4567</guid>
		<description>thanks to u pepole great code!
i have done same like dis one but iam not set the user defined text in cell this code is very easily understand and good logic!</description>
		<content:encoded><![CDATA[<p>thanks to u pepole great code!<br />
i have done same like dis one but iam not set the user defined text in cell this code is very easily understand and good logic!</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Prabu</title>
		<link>http://www.redips.net/javascript/adding-table-rows-and-columns/comment-page-1/#comment-4468</link>
		<dc:creator>Prabu</dc:creator>
		<pubDate>Wed, 21 Sep 2011 10:39:49 +0000</pubDate>
		<guid isPermaLink="false">http://www.redips.net/?p=66#comment-4468</guid>
		<description>Nice code... easy to understand....</description>
		<content:encoded><![CDATA[<p>Nice code... easy to understand....</p>
]]></content:encoded>
	</item>
</channel>
</rss>

