SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Threaded View

  1. #1
    SitePoint Member
    Join Date
    Jul 2011
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Calculating total in dynamic rows

    Hi,
    I am using the following code to take an order. i am adding the rows dynamically in the order form using java script. i want to multiply the quantity and cost to display the total. i am able to do it for the first row but not able to for the dynamically added rows. please help.

    Code Java:
    <%-- 
        Document   : addorderform
        Created on : Jul 26, 2011, 6:18:40 PM
        Author     : Veera
    --%>
     
    <%@page contentType="text/html" pageEncoding="UTF-8"%>
    <%@page import="java.sql.*" %>
    <!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>JSP Page</title>
            <script language="JavaScript" src="scripts/ts_picker.js"></script>
            <script>
     
     
     function addRow(tableID) {
     
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;
                var row = table.insertRow(rowCount);
                var cell0 = row.insertCell(0);
    		cell0.innerHTML=rowCount ;
                    var cell1= row.insertCell(1);
                var element1 = document.createElement("input");
                cell1.appendChild(element1);
                   element1.name="size"+rowCount;
                   element1.size=10;
    		  var cell2= row.insertCell(2);
                var element2 = document.createElement("input");
                cell2.appendChild(element2);
                   element2.name="inches"+rowCount;
                   element2.size=5;
    		   var cell3= row.insertCell(3);
                var element3 = document.createElement("input");
                cell3.appendChild(element3);
                   element3.name="density"+rowCount;
                   element3.size=5;
                   var cell4= row.insertCell(4);
                var element4 = document.createElement("select");
                cell4.appendChild(element4);
                   element4.name="weight"+rowCount;
                   var newoption=new Option("Select","S");
                   element4.options[0]=newoption;
                   newoption=new Option("Plain","P");
                   element4.options[1]=newoption;
                   newoption=new Option("Deluxe","D");
                   element4.options[2]=newoption;
                   element4.selectedIndex=0;
                   var cell5= row.insertCell(5);
                var element5 = document.createElement("input");
                cell5.appendChild(element5);
                   element5.name="qty"+rowCount;
                   element5.size=5;
                    element5.onchange="updateTotal(this);"
     
                   var cell6= row.insertCell(6);
                var element6 = document.createElement("input");
                cell6.appendChild(element6);
                   element6.name="cost"+rowCount;
                   element6.size=10;
                   element6.onchange="updateTotal(this);"
     
                   var cell7= row.insertCell(7);
                var element7 = document.createElement("input");
                cell7.appendChild(element7);
                   element7.name="total"+rowCount;
     
     }
     
     
     
     function updateTotal(x)
     {
     
    var myRow = x.parentNode.parentNode
    myRow.cells[7].innerHTML =
    parseInt(
    myRow.cells[5].getElementsByTagName('INPUT')[0].value)*
    parseInt(
    myRow.cells[6].getElementsByTagName('INPUT')[0].value);
    }
     
    </script>
        </head>
        <body>
            <%
            try
                {
                Class.forName("oracle.jdbc.driver.OracleDriver");
                Connection conn=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:XE","scott","tiger");
                Statement stmt=conn.createStatement();
                String query="select dealer_id,name from dealer where status='A'";
                ResultSet rs=stmt.executeQuery(query);
                %>
                    <form id="addorder" name="addorder" method="post" action="addorderack.jsp">
          <table width="100%" border="0" align="center" valign="middle">
              <tr>
                  <td align="center">
                      <h3>Add order</h3>
                  </td>
              </tr>
              <tr>
        <td width="27%" align="right">Order Id:</td>
        <td width="23%" align="left">
          <input type="text" name="order id" id="textfield" />
        </td>
        <td width="50%" rowspan="9" align="center"><img border="0"  src="http://www.sitepoint.com/forums/images/Add order.JPG" width="70" height="70" /></td>
      </tr>
      <tr>
        <td align="right">Dealer Name:</td>
        <td align="left">
            <select name="dealer id">
                <option value="select">Select</option>
                <%while(rs.next()){%>
                <option value="<%=rs.getString(1)%>"><%=rs.getString(2)%></option>
                <%}%>
            </select>
        </td>
      </tr>
      <tr>
        <td align="right">Remarks:</td>
        <td align="left"><textarea name="remarks" rows="3" cols="35"></textarea></td>
      </tr>
      <tr>
        <td align="right">Tax Type:</td>
        <td align="left">
            <select name="taxtype">
                <option value="select">Select</option>
                <option value="VAT">VAT</option>
                <option value="CST">CST</option>
            </select>
        </td>
      </tr>
      <tr>
     
      <table width="100%" border="0" id="t1">
          <tr>
              <th><b>S.No</th>
              <th><b>Size</th>
              <th><b>Inches</th>
              <th><b>Density</th>
              <th><b>Weight</th>
              <th><b>Quantity</th>
              <th><b>Cost</th>
              <th><b>Total</th>
          </tr>
          <tr>
              <td>1</td>
              <td><input type="text" name="size1" size="10"></td>
              <td><input type="text" name="inches1" size="5"></td>
              <td><input type="text" name="density1" size="5"></td>
              <td><select name="weight1">
                      <option value="S">Select</option>
                      <option value="P">Plain</option>
                      <option value="D">Deluxe</option>
                  </select>
              </td>
              <td><input type="text" name="qty1" size="5" onChange="updateTotal(this)"></td>
              <td><input type="text" name="cost1" size="10" onChange="updateTotal(this)"></td>
              <td><input type="text" name="total1" readonly="true"></td>
          </tr>
      </table>
     
      </tr>
      <tr>
          <td align="right">&nbsp;</td>
          <td align="right"><a href="javascript:addRow('t1')"><b>Add More</a></td>
      </tr>
      <tr>
        <td align="right">&nbsp;</td>
        <td align="center"><input type="submit" name="button" id="button" value="Submit" /></td>
        <td>&nbsp;</td>
      </tr>
          </table></form>
                    <%
                rs.close();
                stmt.close();
                conn.close();
                }
                catch(ClassNotFoundException ce)
                {
                out.println("Unable to load the database driver"+ce);
                }
                catch(SQLException se)
                {
                out.println("SQL Exception"+se);
                }
         %>
        </body>
    </html>
    Last edited by Mittineague; Jul 28, 2011 at 21:39. Reason: reformatting bbcode tags


Tags for this Thread

Bookmarks

Posting Permissions

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