Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 02-28-2012, 09:17 AM   PM User | #1
Abi89
New to the CF scene

 
Join Date: Feb 2012
Posts: 8
Thanks: 0
Thanked 0 Times in 0 Posts
Abi89 is an unknown quantity at this point
Question Newbee 2 javascript... plz help!!!

I hav already got a working code which dynamically adds rows and deletes the rows from a table using javascript

i have understood the adding rows function somewhat as i have just started with javascript , the deleting part contains for loop as well as exception which is little difficult for me to understand .

The most important thing for me now is to calculate the total of 2 columns of individual rows based on the value that is entered by the user as well as the total the calculated rows and i dont know how to do begin this ...

will be greatful if anybody out there could help me as well as explain how it works ... plzzz ... code is as follows ,

Code:
 
<SCRIPT language="javascript">
        function addRow(tableID) {
 
            var table = document.getElementById(tableID);
  			var rowCount = table.rows.length  ;
            var row = table.insertRow(rowCount);
            
 
            var cell1 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "checkbox";
            cell1.appendChild(element1);
 
            var cell2 = row.insertCell(1);
            cell2.innerHTML = rowCount -1  + 1;
 
            var cell3 = row.insertCell(2);
            var element2 = document.createElement("input");
            element2.type = "text";
            element2.id="desc";
            cell3.appendChild(element2);
           
            var cell4 = row.insertCell(3);
            var element3 = document.createElement("input");
            element3.type = "text";
            element3.id="qty";
            cell4.appendChild(element3);
           
           
            var cell5 = row.insertCell(4);
            var element4 = document.createElement("input");
            element4.type = "text";
            element4.id="price";
            cell5.appendChild(element4);
           
           
            var cell6 = row.insertCell(5);
            var element5 = document.createElement("input");
            element5.type = "text";
            element5.id="subtotal";
            cell6.appendChild(element5);
     }      
           
           
       function deleteRow() {
                try {
                var table = document.getElementById('dataTable');
                var rowCount = table.rows.length;
    
                for(var i=1; i<rowCount; i++) {
                    var row = table.rows[i];
                    var chkbox = table.rows[i].cells[0].childNodes[0];
                    var soz = table.rows[i].cells[1];
                    if(null != chkbox && true == chkbox.checked) {
                        //if(    
                        table.deleteRow(i);
                        rowCount--;
                        i--;
    					continue;
                    }
    
                    table.rows[i].cells[1].childNodes[0].nodeValue=i;
    			}
                }catch(e) {
                    alert(e);
                }
            }
        </SCRIPT>  


<INPUT type="button" value="Add Row" onClick="addRow('dataTable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('dataTable')" />
<table id="dataTable" border="1" >
  <tr>
    <th> Check List </th>
    <th> SL  No.</th>
    <th> Description </th>
    <th> Quantity </th>
    <th> Price </th>
    <th> Subtotal </th>
  </tr>
  <TR>
    <TD><INPUT type="checkbox" name="chk"/></TD>
    <TD> 1 </TD>
    <TD><INPUT type="text"  id="desc" /></TD>
    <TD><INPUT type="text" id="qty"  /></TD>
    <TD><INPUT type="text" id="price"  /></TD>
    <TD><INPUT type="text" id="subtotal" /></TD>
  </TR>
</table>

Last edited by VIPStephan; 02-28-2012 at 06:35 PM..
Abi89 is offline   Reply With Quote
Old 02-28-2012, 09:41 AM   PM User | #2
Philip M
Supreme Master coder!

 
Philip M's Avatar
 
Join Date: Jun 2002
Location: London, England
Posts: 17,036
Thanks: 197
Thanked 2,411 Times in 2,389 Posts
Philip M has a spectacular aura aboutPhilip M has a spectacular aura aboutPhilip M has a spectacular aura about
Do please read the posting guidelines regarding silly thread titles. The thread title is supposed to help people who have a similar problem in future. Yours is useless for this purpose. You can (and should) edit it to make it more meaningful.

The closing code tag is /code

<script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript">.
__________________

All the code given in this post has been tested and is intended to address the question asked.
Unless stated otherwise it is not just a demonstration.
Philip M is offline   Reply With Quote
Old 02-28-2012, 06:29 PM   PM User | #3
Abi89
New to the CF scene

 
Join Date: Feb 2012
Posts: 8
Thanks: 0
Thanked 0 Times in 0 Posts
Abi89 is an unknown quantity at this point
Thanks for your reply .... but have you got any ideas how i can go about this code .... i.e. to calculate the total of 2 columns of individual rows based on the value that is entered by the user
Abi89 is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 06:24 PM.


Advertisement
Log in to turn off these ads.