Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    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.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,732
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    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.

  • #3
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •