JavaScript - Help Needed:auto Calculate Total From Rows Added & Add Serv. Charge To Get Grandtotal
Hi, I'm trying to add the total number of costs depending on the rows added to return the subtotal then later add the service charge which gives the total grand amount.
I also need to add the item number when a new row is added. Can any1 help? Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>untitled</title> <script type="text/javascript"> 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<colCount; i++) { var newcell = row.insertCell(i); newcell.innerHTML = table.rows[0].cells[i].innerHTML; //alert(newcell.childNodes); switch(newcell.childNodes[0].type) { case "text": newcell.childNodes[0].value = ""; break; case "checkbox": newcell.childNodes[0].checked = false; break; case "select-one": 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<rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox && true == chkbox.checked) { if(rowCount <= 1) { alert("Cannot delete all the rows."); break; } table.deleteRow(i); rowCount--; i--; } } }catch(e) { alert(e); } } </script> </head> <body > <form action="#" id="calcForm" method="post"> <table border="0" width="680" cellpadding="0" cellspacing="0"> <tr> <td width="60" align="left" valign="top"><b>Item No</b></td> <td width="3"> </td> <td width="290" align="left" valign="top"><b>Description</b></td> <td width="3"> </td> <td width="210" align="left" valign="top"><b>Part No.</b></td> <td width="3"> </td> <td width="50" align="left" valign="top"><b>QTY</b></td> <td width="3"> </td> <td width="63" align="left" valign="top"><b>Cost</b></td> </tr> </table> <table id="parts" border="0" width="680" cellpadding="0" cellspacing="0"> <tr> <td width="60" align="left" valign="top"><INPUT type="checkbox" name="chk"/> <b>1</b></td> <td width="3"> </td> <td width="290" align="left" valign="top"> <input type="text" name="partdesc[]" size="40" value="<?=$info['partdesc'][$x]?>"> </td> <td width="3"> </td> <td width="210" align="left" valign="top"> <input type="text" name="partno[]" size="30" value="<?=$info['partno'][$x]?>"> </td> <td width="3"> </td> <td width="50" align="left" valign="top"> <input type="text" name="qty[]" size="2" value="<?=$info['qty'][$x]?>"> </td> <td width="3"> </td> <td width="63" align="left" valign="top"> <input type="text" name="cost[]" size="4" value="<?=$info['cost'][$x]?>"> </td> </tr> </table> <table id="parts" border="0" width="680" cellpadding="0" cellspacing="0"> <tr> <td width="60" align="left" valign="top"> </td> <td width="3"> </td> <td width="290" align="left" valign="top"> </td> <td width="3"> </td> <td width="210" align="left" valign="top"><b>Sub Total</b></td> <td width="3"> </td> <td width="50" align="left" valign="top"> </td> <td width="3"> </td> <td width="63" align="left" valign="top"> <input type="text" name="subtotal" size="4" value="<?=$info['subtotal']?>"> </td> </tr> <tr> <td width="60" align="left" valign="top"> </td> <td width="3"> </td> <td width="290" align="left" valign="top"><INPUT type="button" value="Add Row" onclick="addRow('parts')" /><INPUT type="button" value="Delete Row" onclick="deleteRow('parts')" /></td> <td width="3"> </td> <td width="210" align="left" valign="top"><b>Service Charge</b></td> <td width="3"> </td> <td width="50" align="left" valign="top"> </td> <td width="3"> </td> <td width="63" align="left" valign="top"> <input type="text" name="charge" size="4" value="<?=$info['charge']?>"> </td> </tr> <tr> <td width="60" align="left" valign="top"> </td> <td width="3"> </td> <td width="290" align="left" valign="top"> </td> <td width="3"> </td> <td width="210" align="left" valign="top"><b>Grand Total</b></td> <td width="3"> </td> <td width="50" align="left" valign="top"> </td> <td width="3"> </td> <td width="63" align="left" valign="top"> <input type="text" name="gtotal" size="4" value="<?=$info['gtotal']?>"> </td> </tr> </table> </form> </body> </html> Similar TutorialsGood day! I am new in javascript function. I have Javascript code for auto calculate here is the code: Code: <script type="text/javascript" language="javascript"> function autocalearn(oText) { if (isNaN(oText.value)) //filter input { alert('Numbers only!'); oText.value = ''; } var field, val, oForm = oText.form, TotEarn = a = 0; for (a; a < arguments.length; ++a) //loop through text elements { field = arguments[a]; val = parseFloat(field.value); //get value if (!isNaN(val)) //number? { TotEarn += val; //accumulate } } var tot=Number(TotEarn) + Number(document.getElementById('Amount').value); oForm.TotEarn.value = tot.toFixed(2); //oForm.TotEarn.value = TotEarn.toFixed(2); //out } </script> <!--Total Deduction AutoCompute--> <script type="text/javascript" language="javascript"> function autocalded(oText) { if (isNaN(oText.value)) //filter input { alert('Numbers only!'); oText.value = ''; } var field, val, oForm = oText.form, TotalDed = a = 0; for (a; a < arguments.length; ++a) //loop through text elements { field = arguments[a]; val = parseFloat(field.value); //get value if (!isNaN(val)) //number? { TotalDed += val; //accumulate } } //oForm.TotalDed.value = TotalDed.toFixed(2); //out var totded=Number(TotalDed) + Number(document.getElementById('Deductions').value); oForm.TotalDed.value = totded.toFixed(2); } </script> and now my problem is...I have a textbox for the overall total, and i want it automatic subtract the total earn and total deduction.. I will attach my codes for further understanding. Thank you in advance Hi, I am thinking of how to write the code for this: There are 4 textboxes, 3 of which allow you to enter any number (e.g. 1000, 2500, 12345, 100.10, etc.). So whenever I entered a number in one of them (or two or all of them), the 4th read-only textbox will automatically shows the total of the values in the 3 textboxes. So...can anyone give me any references to this? Thanks. I have created a function but it only half works. I can get the number of contributers to add up but not the total amount of dollars they contributed. I am not sure if my function is wrong or if I am just confused with what variable to output for the dollar amount total. Please assist. My Function: <script type="text/javascript"> function amountTotal() { total = 0; for (var i=0; i<=amount.length; i++) { total+=amount[i]; } return total; } </script> My output files: <div id=totals> <script type="text/javascript"> document.write("<table border=1' cellspacing=1'>"); document.write("<tr><th id=sumTitle colspan=2'>Summary</th></tr>"); document.write("<tr><th>Contributors</th>"); document.write("<td>"+[i]+"</td>"); document.write("</tr>"); document.write("<tr><th>Amount</th>"); document.write("<td>$ +[total]+</td></tr>"); document.write("</table>"); </script> I have a small price quote calculator/contact information form. I want the customer to fill out the whole form submit it, and get his/her estimated price based on selections in the form. I am using asp, and I have a javascript for the quote calculations. My question is how would I take this js and execute it when the user hits submit, and then display that quote price on the next page. Here is the javascript that I'm working with: Code: var practice_field = new Array(); practice_field["None"]=0; practice_field["Allergy and Immunology"]=4400; practice_field["Endocrinology"]=4400; practice_field["Pathology"]=4400; practice_field["Dermatology"]=4400; practice_field["Geriatrics"]=4400; practice_field["Physical Rehabilitation"]=4400; practice_field["Family Practice"]=6900; practice_field["General Practice"]=6900; practice_field["Internal Medicine"]=6900; practice_field["Oncology"]=6900; practice_field["Oral Surgery"]=6900; practice_field["Radiology"]=6900; practice_field["Gastroenterology"]=6900; practice_field["Infectious Disease"]=6900; practice_field["Nephrology"]=6900; practice_field["Ophthalmology"]=6900; practice_field["Pediatrics"]=6900; practice_field["Urology"]=6900; practice_field["Anesthesiology"]=9000; practice_field["Cosmetic Surgery"]=9000; practice_field["General Surgery"]=9000; practice_field["Neurology"]=9000; practice_field["Otolaryngology"]=9000; practice_field["Plastic Surgery"]=9000; practice_field["Vascular Surgery"]=9000; practice_field["Cardiology"]=9000; practice_field["Emergency Medicine"]=9000; practice_field["Gynecology"]=9000; practice_field["Orthopedic Surgery"]=9000; practice_field["Pain Management"]=9000; practice_field["Pulmonary Surgery"]=9000; practice_field["Neurological Surgery"]=9900; practice_field["Obstetrics"]=9900; var society_member= new Array(); society_member["None"]=null; society_member["BCMA"]=0.10; society_member["DCMA"]=0.10; society_member["FOGS"]=0.10; society_member["FNS"]=0.10; society_member["PBCMS"]=0.10; society_member["FSPS"]=0.10; function getPracticeField() { var docPracticeField=0; var theForm = document.forms["quoteform"]; var selectedPracticeField = theForm.elements["practice"]; docPracticeField = practice_field[selectedPracticeField.value]; return docPracticeField; } function getSelectedSociety() { var docSelectedSociety=0; var theForm = document.forms["quoteform"]; var selectedSociety = theForm.elements["society"]; docSelectedSociety = society_member[selectedSociety.value]; return docSelectedSociety; } function bareDefensePrice() { var defensePrice=0; var theForm = document.forms["quoteform"]; var includeDefense = theForm.elements["baredefense"]; if(includeDefense.checked==true) { defensePrice=0; } return defensePrice; } function insuranceDefensePrice() { var insuranceDefense=0; var theForm = document.forms["quoteform"]; var includeMoreDefense = theForm.elements["insureddefense"]; if(includeMoreDefense.checked==true){ insuranceDefense=0; } return insuranceDefense; } function calculateTotal() { var defensePrice = getPracticeField() + null - (getPracticeField() * getSelectedSociety()) + bareDefensePrice() + insuranceDefensePrice(); var divobj = document.getElementById('totalPrice'); divobj.style.display='block'; divobj.innerHTML = "Your Pre-Paid Legal Defense Fee Will Be Around $"+defensePrice; } function hideTotal() { var divobj = document.getElementById('totalPrice'); divobj.style.display='none'; } here is the html: Code: <body onload='hideTotal()'> <div id="wrap"> <form action="" id="quoteform" onsubmit=""> <div> <div class="cont_order"> <fieldset> <legend>How Much Will My Pre-Paid Legal Defense Cost?</legend> <label >Choose Your Practice Field</label> <select id="practice" name='practice' onchange="calculateTotal()"> <option value="None">Select Field</option> <option value="Allergy and Immunology">Allergy and Immunology</option> <option value="Endocrinology">Endocrinology</option> <option value="Pathology">Pathology</option> <option value="Dermatology">Dermatology</option> <option value="Geriatrics">Geriatrics</option> <option value="Physical Rehabilitation">Physical Rehabilitation</option> <option value="Family Practice">Family Practice</option> <option value="General Practice">General Practice</option> <option value="Internal Medicine">Internal Medicine</option> <option value="Oncology">Oncology</option> <option value="Oral Surgery">Oral Surgery</option> <option value="Radiology">Radiology</option> <option value="Gastroenterology">Gastroenterology</option> <option value="Infectious Disease">Infectious Disease</option> <option value="Nephrology">Nephrology</option> <option value="Ophthalmology">Ophthalmology</option> <option value="Pediatrics">Pediatrics</option> <option value="Urology">Urology</option> <option value="Anesthesiology">Anesthesiology</option> <option value="Cosmetic Surgery">Cosmetic Surgery</option> <option value="General Surgery">General Surgery</option> <option value="Neurology">Neurology</option> <option value="Otolaryngology">Otolaryngology</option> <option value="Plastic Surgery">Plastic Surgery</option> <option value="Vascular Surgery">Vascular Surgery</option> <option value="Cardiology">Cardiology</option> <option value="Emergency Medicine">Emergency Medicine</option> <option value="Gynecology">Gynecology</option> <option value="Orthopedic Surgery">Orthopedic Surgery</option> <option value="Pain Management">Pain Management</option> <option value="Pulmonary Surgery">Pulmonary Surgery</option> <option value="Neurological Surgery">Neurological Surgery</option> <option value="Obstetrics">Obstetrics</option> </select> <br/> <p> <label >Are You Affiliated With Any of the Following Medical Societies</label> <select id="society" name='society' onchange="calculateTotal()"> <option value="None">Select Society</option> <option value="None">No, I am not</option> <option value="BCMA">Broward County Medical Association</option> <option value="DCMA">Dade County Medical Association</option> <option value="FOGS">Florida Obstetrics & Gynecology Society</option> <option value="FNS">Florida Neurological Society</option> <option value="PBCMS">Palm Beach County Medical Society</option> <option value="FSPS">Florida Society of Plastic Surgeons</option> </select> </p> <br/> <label >What Type of Defense Are You Interested In?</label> <br /> <label for='baredefense' class="inlinelabel">Bare Defense</label> <input type="checkbox" id="baredefense" name='baredefense' onclick="calculateTotal()" /> <br /> <label class="inlinelabel" for='insureddefense'>Insured Defense</label> <input type="checkbox" id="insureddefense" name="insureddefense" onclick="calculateTotal()" /> </p> <div id="totalPrice"></div> </fieldset> </div> <div class="cont_details"> <fieldset> <legend>Contact Details</legend> <label for='name'>Name</label> <input type="text" id="name" name='name' /> <br/> <label for='address'>Address</label> <input type="text" id="address" name='address' /> <br/> <label for='phonenumber'>Phone Number</label> <input type="text" id="phonenumber" name='phonenumber'/> <br/> </fieldset> </div> <input type='submit' id='submit' value='Calculate Rate' onclick="calculateTotal()" /> </div> </form> </div><!--End of wrap--> Hi, please help. I've been trying to check what I did wrong in my code but still the total doesn't show. Below is my javascript function: Code: function CalculateTotal(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r) { var tota= document.getElementById('a'); var totb= document.getElementById('b'); var totc= document.getElementById('c'); var totd= document.getElementById('d'); var tote= document.getElementById('e'); var totf= document.getElementById('f'); var totg= document.getElementById('g'); var toth= document.getElementById('h'); var toti= document.getElementById('i'); var totj= document.getElementById('j'); var totk= document.getElementById('k'); var totl= document.getElementById('l'); var totm= document.getElementById('m'); var totn= document.getElementById('n'); var toto= document.getElementById('o'); var totp= document.getElementById('p'); var totq= document.getElementById('q'); var totr= document.getElementById('r'); var grandTotal = tota + totb +totc + totd + tote + totf + totg + toth + toti +totj + totk + totl + totm + totn + toto + totp +totq + totr; document.getElementById('Total').value = grandTotal.toFixed(2); } Below is my textbox where there are more than 10 textboxes for user to enter donation amount. I'd like to calculate all the donation amount entered then show total in the bottom. Code: <fieldset id="fieldset-in_registration"> <table> <tr> <td style="width:390px;text-align:left"><label for="a" style="font-weight:bold">A. Aloha United Way Community Care Fund </label></td> <td style="float:right"> <input id="a" name="a" class="text" type="text" value="$<?php safeEcho($form['a'])?>" style="width:100px;" onChange="CalculateTotal()" /> <?php helper_error('a');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="b">211 Information and Referral Services </label></td> <td style="float:right"> <input id="b" name="b" class="text" type="text" value="$<?php safeEcho($form['b'])?>" style="width:100px;" onChange="CalculateTotal()" /> <?php helper_error('b');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="c">Volunteer Hawaii/Gifts-in-Kind</label></td> <td style="float:right"> <input id="c" name="c" class="text" type="text" value="$<?php safeEcho($form['c'])?>" style="width:100px;" onChange="CalculateTotal()"/> <?php helper_error('c');?> </td> </tr> </table> </fieldset> <fieldset id="fieldset-in_registration"> <label for="impact" style="font-weight:bold">B. Impact Areas</label> <table> <tr> <td style="width:390px;text-align:left"><label for="d">Crime and Drug Use</label></td> <td style="float:right"> <input id="d" name="d" class="text" type="text" value="$<?php safeEcho($form['d'])?>" style="width:100px;" onChange="CalculateTotal()"/> <?php helper_error('d');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="e">Early Childhood Development</label></td> <td style="float:right"> <input id="e" name="e" class="text" type="text" value="$<?php safeEcho($form['e'])?>" style="width:100px;" onChange="CalculateTotal()" /> <?php helper_error('e');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="f">Emergency and Crisis Services</label></td> <td style="float:right"> <input id="f" name="f" class="text" type="text" value="$<?php safeEcho($form['f'])?>" style="width:100px;" onChange="CalculateTotal()" /> <?php helper_error('f');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="g" >Financial Stability and Independence</label></td> <td style="float:right"> <input id="g" name="g" class="text" type="text" value="$<?php safeEcho($form['g'])?>" style="width:100px;" onChange="CalculateTotal()"/> <?php helper_error('g');?> </td> </tr> <tr> <td style="width:390px;text-align:left"><label for="h" >Homelessness</label></td> <td style="float:right"> <input id="h" name="h" class="text" type="text" value="$<?php safeEcho($form['h'])?>" style="width:100px;" onChange="CalculateTotal()"/> <?php helper_error('h');?> </td> </tr> </table> </fieldset> <fieldset id="fieldset-in_registration"> <p>D. <b>Agency/Program Support ($48 MINIMUM PER CHOICE)</b></p> <p>My gift is designated to one or more specific agencies or programs. Processing fee may apply. <p style="color:#FF0000">(Note: Agency Name is intentionally shorten/cut-off and indented to the next line to fit in the page. Choose either one of the indented line will give the same code.)</p> <div class="formfield"> <table> <tr> <td> <select id="designation_list1" name="designation_list1" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="i" name="i" class="text" type="text" value="$<?php safeEcho($form['i'])?>" style="width:100px;" onChange="CalculateTotal()""/> </td> </tr> <tr> <td> <select id="designation_list2" name="designation_list2" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="j" name="j" class="text" type="text" value="$<?php safeEcho($form['j'])?>" style="width:100px;" onChange="CalculateTotal();"/> </td> </tr> <tr> <td> <select id="designation_list3" name="designation_list3" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="k" name="k" class="text" type="text" value="$<?php safeEcho($form['k'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list4" name="designation_list4" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="l" name="l" class="text" type="text" value="$<?php safeEcho ($form['l'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list5" name="designation_list5" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="m" name="m" class="text" type="text" value="$<?php safeEcho($form['m'])?>" style="width:100px;" onChange="CalculateTotal();"/> </td> </tr> <tr> <td> <select id="designation_list6" name="designation_list6" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="n" name="n" class="text" type="text" value="$<?php safeEcho($form['n'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list7" name="designation_list7" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="o" name="o" class="text" type="text" value="$<?php safeEcho($form['o'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list8" name="designation_list8" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="p" name="p" class="text" type="text" value="$<?php safeEcho($form['p'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list9" name="designation_list9" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="q" name="q" class="text" type="text" value="$<?php safeEcho($form['q'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td> <select id="designation_list10" name="designation_list10" size="1" style="overflow-x:scroll; width:390px; "> <?php foreach ($designation_list as $descode => $prompt) : ?> <option value="<?php echo $descode; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> <input id="r" name="r" class="text" type="text" value="$<?php safeEcho($form['r'])?>" style="width:100px;" onChange="CalculateTotal()"/> </td> </tr> <tr> <td style="text-align:right;"><b>TOTAL GIFT(S) DESIGNATED (A-D)</b><BR /> (Must not exceed donation amount)</td> <td><input name="Total" id="Total" type="text" maxlength="10" readonly="true" onChange="CalculateTotal(this.value)" /></td> </tr> </table> Please help. I tried for how many days using the javascript calculations and still didn't work. I have a form with the same calculations and it does work but this one doesn't. Please help. Thanks a lot. Hope to hear from you soon. Need help please asap. It might be simple but i couldn't work out the script. help! ---------------- Formfield.anzahl1 = number entered by customer Formfield.Price1 = Ergebnisfeld1 e.g. Anzahl1= 1 Price = 270 *if Anzahl1 = 2 then Price = 270*2 I need to do this for two form option. 2nd field would be as follows Formfield.Anzahl2= number entered by customer Formfield.Price2 = Ergebnisfeld2 Then Formfield.Total = Ergebnisfeld1 + Ergebnisfeld2 ------------------- How can I convert these above to javascript? Hi, I have a dynamic JS table and the user can add several rows then populate rows with data. There are 4 columns in table. First row, first two columns have JQuery calendar. Third column has populated select list. Fourth column, first row has JS function to ensure that user enters integer/decimal with corresponding alert for incorrect entry. Two things I want to do: 1. Populate added rows with JQuery calendars and integer/decimal alert. 2. Capture added rows and data from user entries so that information can be sent to database via ColdFusion programming. The following is the js code I am using: For the datepicker I linked to an in-house URL so this is the function - Code: $(function() { $("#startdate").datepicker(); $("#enddate").datepicker(); $("#RcompStart").datepicker(); $("#RcompEnd").datepicker(); }); </script> The objects (inputs) for the above are Code: <td><input style="width: 70px" type="text" id="startdate"></td> <td><input style="width: 70px" type="text" id="enddate"></td> For the numeric alert the function is Code: <script type="text/javascript"> function checkQuarters( fld ) { var val = parseFloat(fld.value); if ( isNaN(val) || ( val*4 != Math.floor(val*4) ) ) { alert("Value must be a numeric and a multiple of 0.25"); return false; } return true; } </script> The object (input) for the above is Code: <td><p> <form style="width: 5px; height: 1px;"> <input type="text" name="No. of Hours" id="No. of Hours" style="width: 70px;" onblur="checkQuarters(this);" /> </form> </td> And to add and remove rows the function is Code: <script language="Javascript" type="text/javascript"> /*<![CDATA[*/ var new_rows=new Array(); var row_count=0; function addRow() { var tbl = document.getElementById('ReqDtTbl'); new_rows[row_count]=new Array(); var lastRow = tbl.rows.length; var iteration = lastRow; if (lastRow>7){ return;} var row = tbl.insertRow(lastRow); var cellLeft = row.insertCell(0); var textNode = document.createElement('input'); textNode.size = 7; textNode.name = 'startdate' + iteration; cellLeft.appendChild(textNode); new_rows[row_count]['cell']=textNode; var cellRight = row.insertCell(1); var el = document.createElement('input'); el.type = 'text'; el.name = 'enddate' + iteration; el.id = 'enddate' + iteration; el.size = 7; new_rows[row_count]['cell2']=el; cellRight.appendChild(el); // the last cell! var cellRightSel = row.insertCell(2); var sel = document.createElement('select'); sel.name = 'TypeHrs' + iteration; sel.options[0] = new Option('-Select-', '""'); sel.options[1] = new Option('Comp Time', 'Comp Time'); sel.options[2] = new Option('Credit Hrs', 'Credit Hrs'); sel.options[3] = new Option('Overtime', 'Overtime'); sel.options[4] = new Option('Rel Comp', 'Rel Comp'); cellRightSel.appendChild(sel); new_rows[row_count]['cell3']=sel; var cellRight = row.insertCell(3); var el = document.createElement('input'); el.type = 'text'; el.name = 'No. of Hours' + iteration; el.id = 'No. of Hours' + iteration; el.size = 7; cellRight.appendChild(el); new_rows[row_count]['cell']=el; row_count++; } function removeRow() { // grab element again var tbl = document.getElementById('ReqDtTbl'); // grab length var lastRow = tbl.rows.length; // delete last row if there is more than one row if (lastRow > 2) tbl.deleteRow(lastRow - 1); } /*]]>*/ </script> The buttons for this function are Code: <input type="button" value="Add a row" onclick="addRow('ReqDtTbl',5)";/> <input type="button" value="Remove a row" onclick="removeRow();" /> That's it. Thanks - John Hi.I have found this nice code through forum.Now I want to modify it a little bit.But dont know how to It calculates amount column value by multiplying quantity to amount.i.e. amount=qty*rate and gross total is sum of all the array elements in amount.Here I want to add two more columns viz vat% and vat amount.Simply it will be amount*vat% / 100.Can anyone please tell me how I can do that?Other thing is, is it possible to separate the 5% vat and 12.5% vat values and display the total of them in respective column? Here is the link for reference : http://kavisandeepdwivedi.com/forum.php Please go through the code below and help me out Code: <html> <head> <script type="text/javascript"> function tot(elem) { var d=document.getElementById("total").value; var total=Number(d); var e=document.getElementById("vat5").value; var vat5=Number(e); var f=document.getElementById("vat12_5").value; var vat12_5=Number(f); var g=document.getElementById("cash_discount").value; var cash_discount=Number(g); var h=(total+vat5+vat12_5)-cash_discount; document.getElementById("grand_total").value = h; } var total = 0; function getValues() { var qty = 0; var rate = 0; var obj = document.getElementsByTagName("input"); for(var i=0; i<obj.length; i++){ if(obj[i].name == "qty[]"){var qty = obj[i].value;} if(obj[i].name == "rate[]"){var rate = obj[i].value;} if(obj[i].name == "amt[]"){ if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);} else{obj[i].value = 0;total+=(obj[i].value*1);} } } document.getElementById("total").value = total*1; total=0; } </script> <script type="text/javascript"> 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<colCount; i++) { var newcell = row.insertCell(i); newcell.innerHTML = table.rows[0].cells[i].innerHTML; //alert(newcell.childNodes); switch(newcell.childNodes[0].type) { case "text": newcell.childNodes[0].value = ""; break; case "checkbox": newcell.childNodes[0].checked = false; break; case "select-one": 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<rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if (null != chkbox && true == chkbox.checked) { if (rowCount <= 1) { alert("Cannot delete all the rows."); break; } table.deleteRow(i); rowCount--; i--; } } } catch(e) { alert(e); } getValues(); } </script> </head> <body> <form name="gr" method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" onSubmit="return validateForm(this)"> <tr> <td class="forhead" style="white-space:nowrap;"><input type="button" value="Add Row" onClick="addRow('dataTable')" > <input type="button" value="Delete Row" onClick="deleteRow('dataTable')" ></td> <table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0"> <td width="20"></td> <td width="80" class="forhead" style="white-space:nowrap;">Qty</td> <td width="80" class="forhead" style="white-space:nowrap;">Rate</td> <td width="80" class="forhead" style="white-space:nowrap;">Amount</td> <td width="80" class="forhead" style="white-space:nowrap;">Vat</td> <td width="80" class="forhead" style="white-space:nowrap;">Vat Amount</td> </tr> </table> <table border="0" id="dataTable" width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text"> <tr> <td class="forhead" style="white-space:nowrap;" width="20"><input type="checkbox" name="chk[]"/></td> <td class="forhead" style="white-space:nowrap;" width="80"><input type="text" name="qty[]" onkeyup="getValues()" style="width:80px;" onBlur=""></td> <td class="forhead" style="white-space:nowrap;" width="80"><input type="text" name="rate[]" onKeyUp="getValues()" style="width:80px;" value=""></td> <td class="forhead" style="white-space:nowrap;" width="80"><input type="text" name="amt[]" style="width:80px;" onKeyUp="getValues()"></td> <td width="80" align="right" class="forhead" style="white-space:nowrap;"> <select name="vat[]" style="width:80px" onChange="getValues()"> <option value="0">Select</option> <option value="5">5</option> <option value="12.5">12.5</option> </select> </td> <td class="forhead" style="white-space:nowrap;" width="80"><input type="text" name="vat_amt[]" style="width:80px;"></td> </tr> </table> <table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0"> <tr> <td width="20" class="forhead" style="white-space:nowrap;"> </td> <td width="80" class="forhead" style="white-space:nowrap;">Gross Total:</td> <td width="80" class="forhead" style="white-space:nowrap;"> </td> <td width="80" class="forhead" style="white-space:nowrap;"> </td> <td width="80" class="forhead" style="white-space:nowrap;"> </td> <td width="80" class="forhead" style="white-space:nowrap;"><input type="text" id="total" name="total[]" style="width:80px;" value=""></td> </tr> <tr> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;">Vat 5%:</td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"><input type="text" name="vat5[]" id="vat5" style="width:80px;"></td> </tr> <tr> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;">Vat 12.5%:</td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"><input type="text" name="vat12_5[]" id="vat12_5" style="width:80px;"></td> </tr> <tr> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;">Cash Dis :</td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"><input type="text" id="cash_discount" name="cash_discount[]" style="width:80px;" value=""></td> </tr> <tr> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;">Total :</td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"> </td> <td class="forhead" style="white-space:nowrap;"><input type="text" name="grand_total" id="grand_total" onKeyUp="tot()" style="width:80px;"></td> </tr> <tr> <td align="center" colspan="6"> <input name="Submit" type="submit" value="Save" style="text-decoration:none"/> <input type="reset" value="Cancel" onClick="window.location.href='<?php echo $_SERVER['PHP_SELF'];?>'"> </td> </tr> </table> </td> </tr> </table> </td> </tr> </form> </body> </html> hi, can someone help me create an auto pro rata calculator where there are four [4] boxes. first box should be where we could enter the customer's plan [29,39,40 etc.] and it should be divided with what ever i will enter on the second box w/c will be for the number of days in a month [28,29,30,31]. the 3rd box should be where i can enter the number of days the cust. was able to use the service and it needs to be multiplied from box 2. 4th box should be a read only box where the pro rata will be displayed. so: [box 1] divided "/" by [box 2] multiplied "*" by [box 3] equals "=" to box four thanks!!! Hi... I just want to know if it is possible to have an autocalculate in a textboxes inside while loop?and if it is possible how?.. here is my code: Code: <html> <head> <style type="text/css"> #fieldset_PS{ position: relative; width: 20%; } </style> <link rel="stylesheet" type="text/css" href="kanban.css" /> <script type="text/javascript"> function display_PS(){ document.loading_kanban.action="ParameterSettings.php"; document.loading_kanban.submit(); } function display_Kanban(){ document.loading_kanban.action="kanban_report.php"; document.loading_kanban.submit(); } </script> </head> <?php error_reporting(0); $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); ?> <form name="loading_kanban"> <div id="main_button"> <center> <!--<label style="margin-left: .9em; font-family: Arial, Helvetica, sans-serif; font-size: .7em;">Display Details:</label><input onclick='showDetails(this);' id='chkDetail' type='checkbox' checked='checked' value='wip'/> --> <input type="button" name="parameter_settings" value="Parameter Settings" onclick="display_PS()"> <input type="button" name="parameter_settings" value="Stock Requisition"> <input type="button" name="parameter_settings" value="Kanban Report" onclick="display_Kanban()"> </div> <div id="fieldset_PS"> <fieldset> <legend>Parameter Settings</legend> </center> <table border="1"> <th>Compounds</th> <th>Max</th> <th>Min</th> <?php $sql = "SELECT PCODE FROM parameter_settings ORDER BY PCODE ASC"; $result = mysql_query($sql, $con); while ($row = mysql_fetch_assoc($result)){ echo "<tr> <td>$row[PCODE]</td> <td><input type = 'text' name = 'max_pcode' size = '10'></td> <td><input type = 'text' name = 'min_pcode' size = '10'></td> </tr>"; } ?> </fieldset> </table> </div> </form> </html> I have table : parameter settings and i have fields: PCODE, max, min PCODE has data: PXX PYY PZZ PAA PBB Total I just want to know how can I auto calculate the total max and total min and it will display in the textbox beside Total... Thank you Hi all... i need to auto calculate 3 fields and store the result in 2 fields: field 3 = field 1 * field 2 field 5 = (field 1 * field 2) - field 4 or field 3 - field 4 so far i'm trying to modify an existing code but i'm still can't get it working correcly Code: <html> <head> <script type="text/javascript"> function compute(inputObj, otherInputID, multiID, subID, diffID) { var otherObj = document.getElementById(otherInputID) var multiObj = document.getElementById(multiID) var subObj = document.getElementById(subID) var diffObj = document.getElementById(diffID) var v1=inputObj.value var v2=otherObj.value var v3=multiObj.value var v4=subObj.value var val1 = v1=="" ? 0 : parseFloat(v1) // convert string to float var val2 = v2=="" ? 0 : parseFloat(v2) var val3 = v3=="" ? 0 : parseFloat(v3) var val4 = v4=="" ? 0 : parseFloat(v4) multiObj.value = val1 * val2 diffObj.value = (val1 * val2)-val4 } </script> </head> <body> Value 1: <input id="txt1" type="text" onKeyUp="compute(this, 'txt2', 'addres', 'subtract', 'mulres')"> <br /> Value 2: <input id="txt2" type="text" onKeyUp="compute(this, 'txt1', 'addres', 'subtract', 'mulres')"> <br /> Added Result: <input id="addres" type="text"> <br /> substract: <input id="subtract" type="text" onKeyUp="compute('txt1', 'txt2', 'addres', this, 'mulres')"> <br /> Multiplied Result: <input id="mulres" type="text"> </body> </html> my problem is the Multiplied Result field not automatically change the result when i enter value in subtract field. it will change if i retype the value in field 1 and 2. Hope somebody can help me. Thank in advance Hi.. I have syntax for autocalculate the max lot and the output display in Total_max same with min lot and the output display in Totam_min, now I need to have convert automatically the number I was inputted in max lot textbox and it will display in max doz textbox same also with min lot convert to min doz textbox. the conversion is: max doz = max lot * 10 min doz = min lot * 10 here is my code: Code: <html> <head> <link rel="stylesheet" type="text/css" href="kanban.css" /> <script type="text/javascript"> function display_PS(){ document.loading_kanban.action="ParameterSettings.php"; document.loading_kanban.submit(); } function display_Kanban(){ document.loading_kanban.action="kanban_report.php"; document.loading_kanban.submit(); } </script> <script type="text/javascript"> //Code for auto calculate Total Max// function autocalearn(oText) { if (isNaN(oText.value)) //filter input { alert('Numbers only!'); oText.value = ''; } var field, val, oForm = oText.form, Total_max = a = 0; for (a; a < arguments.length; ++a) //loop through text elements { field = arguments[a]; val = parseFloat(field.value); //get value if (!isNaN(val)) //number? { Total_max += val; //accumulate } } oForm.Total_max.value = Total_max.toFixed(2); //out } </script> <script type="text/javascript"> //Code for auto calculate Total Min// function autocalmin(oText) { if (isNaN(oText.value)) //filter input { alert('Numbers only!'); oText.value = ''; } var field, val, oForm = oText.form, Total_min = a = 0; for (a; a < arguments.length; ++a) //loop through text elements { field = arguments[a]; val = parseFloat(field.value); //get value if (!isNaN(val)) //number? { Total_min += val; //accumulate } } oForm.Total_min.value = Total_min.toFixed(2); //out } </script> </head> <form name="loading_kanban"> <div id="main_button"> <center> <!--<label style="margin-left: .9em; font-family: Arial, Helvetica, sans-serif; font-size: .7em;">Display Details:</label><input onclick='showDetails(this);' id='chkDetail' type='checkbox' checked='checked' value='wip'/> --> <input type="button" name="parameter_settings" value="Parameter Settings" onclick="display_PS()"> <input type="button" name="parameter_settings" value="Stock Requisition"> <input type="button" name="parameter_settings" value="Kanban Report" onclick="display_Kanban()"> </center> </div> <div id="fieldset_PS"> <center> <table border="1"> <th>Compounds</th> <th>Max</th> <th>UOM</th> <th>Max</th> <th>UOM</th> <th>Min</th> <th>UOM</th> <th>Min</th> <th>UOM</th> <tr> <td><label id="P27" name="P27" size="6" style="text-align: center;">P27</label></td> <td><input type="text" name="P27_max" id="P27_max" size="6" onkeyup="return autocalearn(this, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P27LOT_max" name="P27LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P27_maxdoz" id="P27_maxdoz" size="6"></td> <td><label id="P27Doz_max" name="P27Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P27_min" id="P27_min" size="6" onkeyup="return autocalmin(this, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P27LOT_min" name="P27LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P27_mindoz" id="P27_mindoz" size="6"></td> <td><label id="P27Doz_min" name="P27Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P28" name="P28" size="6">P28</label></td> <td><input type="text" name="P28_max" id="P28_max" size="6" onkeyup="return autocalearn(this, P27_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P28LOT_max" name="P28LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P28_maxdoz" id="P28_maxdoz" size="6"></td> <td><label id="P28Doz_max" name="P28Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P28_min" id="P28_min" size="6" onkeyup="return autocalmin(this, P27_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P28LOT_min" name="P28LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P28_mindoz" id="P28_mindoz" size="6"></td> <td><label id="P28Doz_min" name="P28Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P30" name="P30" size="6">P30</label></td> <td><input type="text" name="P30_max" id="P30_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P30LOT_max" name="P30LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P30_maxdoz" id="P30_maxdoz" size="6"></td> <td><label id="P30Doz_max" name="P30Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P30_min" id="P30_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P30LOT_min" name="P30LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P30_mindoz" id="P30_mindoz" size="6"></td> <td><label id="P30Doz_min" name="P30Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P32W" name="P32W" size="6">P32W</label></td> <td><input type="text" name="P32W_max" id="P32W_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P32WLOT_max" name="P32WLOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P32W_maxdoz" id="P32W_maxdoz" size="6"></td> <td><label id="P32WDoz_max" name="P32WDoz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P32W_min" id="P32W_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P32WLot_min" name="P32WLot_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P32W_mindoz" id="P32W_mindoz" size="6"></td> <td><label id="P32WDoz_min" name="P32WDoz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P33" name="P33" size="6">P33</label></td> <td><input type="text" name="P33_max" id="P33_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P33LOT_max" name="P33LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P33_maxdoz" id="P33_maxdoz" size="6"></td> <td><label id="P33Doz_max" name="P33Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P33_min" id="P33_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P33LOT_min" name="P33LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P33_mindoz" id="P33_mindoz" size="6"></td> <td><label id="P33Doz_min" name="P33Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P35" name="P35" size="6">P35</label></td> <td><input type="text" name="P35_max" id="P35_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P35LOT_max" name="P35LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35_maxdoz" id="P35_maxdoz" size="6"></td> <td><label id="P35Doz_max" name="P35Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P35_min" id="P35_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P35LOT_min" name="P35LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35_mindoz" id="P35_mindoz" size="6"></td> <td><label id="P35Doz_min" name="P35Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P35M" name="P35M" size="6">P35M</label></td> <td><input type="text" name="P35M_max" id="P35M_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P35MLOT_max" name="P35MLOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35M_maxdoz" id="P35M_maxdoz" size="6"></td> <td><label id="P35MDoz_max" name="P35MDoz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P35M_min" id="P35M_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P35MLOT_min" name="P35MLOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35M_mindoz" id="P35M_mindoz" size="6"></td> <td><label id="P35MDoz_min" name="P35MDoz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P35W" name="P35W" size="6">P35W</label></td> <td><input type="text" name="P35W_max" id="P35W_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P35WLOT_max" name="P35WLOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35W_maxdoz" id="P35W_maxdoz" size="6"></td> <td><label id="P35WDoz_max" name="P35WDoz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P35W_min" id="P35W_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P35WLOT_min" name="P35WLOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P35W_mindoz" id="P35W_mindoz" size="6"></td> <td><label id="P35WDoz_min" name="P35WDoz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P38" name="P38" size="6">P38</label></td> <td><input type="text" name="P38_max" id="P38_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P38LOT_max" name="P38LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P38_maxdoz" id="P38_maxdoz" size="6"></td> <td><label id="P38Doz_max" name="P38Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P38_min" id="P38_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P38LOT_min" name="P38LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P38_mindoz" id="P38_mindoz" size="6"></td> <td><label id="P38Doz_min" name="P38Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P41" name="P41" size="6">P41</label></td> <td><input type="text" name="P41_max" id="P41_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P42_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P41LOT_max" name="P41LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P41_maxdoz" id="P41_maxdoz" size="6"></td> <td><label id="P41Doz_max" name="P41Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P41_min" id="P41_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P42_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P41LOT_min" name="P41LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P41_mindoz" id="P41_mindoz" size="6"></td> <td><label id="P41Doz_min" name="P41Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P42" name="P42" size="6">P42</label></td> <td><input type="text" name="P42_max" id="P42_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P43_max, P45_max, P46_max, P47_max)"></td> <td><label id="P42LOT_max" name="P42LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P42_maxdoz" id="P42_maxdoz" size="6"></td> <td><label id="P42Doz_max" name="P42Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P42_min" id="P42_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P43_min, P45_min, P46_min, P47_min)"></td> <td><label id="P42LOT_min" name="P42LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P42_mindoz" id="P42_mindoz" size="6"></td> <td><label id="P42Doz_min" name="P42Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P43" name="P43" size="6">P43</label></td> <td><input type="text" name="P43_max" id="P43_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P45_max, P46_max, P47_max)"></td> <td><label id="P43LOT_max" name="P43LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P43_maxdoz" id="P43_maxdoz" size="6"></td> <td><label id="P43Doz_max" name="P43Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P43_min" id="P43_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P45_min, P46_min, P47_min)"></td> <td><label id="P43LOT_min" name="P43LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P43_mindoz" id="P43_mindoz" size="6"></td> <td><label id="P43Doz_min" name="P43Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P45" name="P45" size="6">P45</label></td> <td><input type="text" name="P45_max" id="P45_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P46_max, P47_max)"></td> <td><label id="P45LOT_max" name="P45LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P45_maxdoz" id="P45_maxdoz" size="6"></td> <td><label id="P45Doz_max" name="P45Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P45_min" id="P45_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P46_min, P47_min)"></td> <td><label id="P45LOT_min" name="P45LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P45_mindoz" id="P45_mindoz" size="6"></td> <td><label id="P45Doz_min" name="P45Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P46" name="P46" size="6">P46</label></td> <td><input type="text" name="P46_max" id="P46_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P47_max)"></td> <td><label id="P46LOT_max" name="P46LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P46_maxdoz" id="P46_maxdoz" size="6"></td> <td><label id="P46Doz_max" name="P46Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P46_min" id="P46_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P47_min)"></td> <td><label id="P46LOT_min" name="P46LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P46_mindoz" id="P46_mindoz" size="6"></td> <td><label id="P46Doz_min" name="P46Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="P47" name="P47" size="6">P47</label></td> <td><input type="text" name="P47_max" id="P47_max" size="6" onkeyup="return autocalearn(this, P27_max, P28_max, P30_max, P32W_max, P33_max, P35_max, P35M_max, P35W_max, P38_max, P41_max, P42_max, P43_max, P45_max, P46_max)"></td> <td><label id="P47LOT_max" name="P47LOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P47_maxdoz" id="P47_maxdoz" size="6"></td> <td><label id="P47Doz_max" name="P47Doz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="P47_min" id="P47_min" size="6" onkeyup="return autocalmin(this, P27_min, P28_min, P30_min, P32W_min, P33_min, P35_min, P35M_min, P35W_min, P38_min, P41_min, P42_min, P43_min, P45_min, P46_min)"></td> <td><label id="P47LOT_min" name="P47LOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="P47_mindoz" id="P47_mindoz" size="6"></td> <td><label id="P47Doz_min" name="P47Doz_min" size="3" style="text-align: left;">Doz</label></td> </tr> <tr> <td><label id="Total" name="Total" size="6"><b>Total</b><label></td> <td><input type="text" name="Total_max" id="Total_max" size="6"></td> <td><label id="TotalLOT_max" name="TotalLOT_max" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="Total_maxdoz" id="Total_maxdoz" size="6"></td> <td><label id="TotalDoz_max" name="TotalDoz_max" size="3" style="text-align: left;">Doz</label></td> <td><input type="text" name="Total_min" id="Total_min" size="6"></td> <td><label id="TotalLOT_min" name="TotalLOT_min" size="3" style="text-align: left;">Lot</label></td> <td><input type="text" name="Total_mindoz" id="Total_mindoz" size="6"></td> <td><label id="TotalDoz_min" name="TotalDoz_min" size="3" style="text-align: left;">Doz</label></td> </tr> </table> </center> </div> <div id="footer_button"> <input type="button" name="SAVE" value="SAVE" style="width: 25%;"> <input type="button" name="CANCEL" value="CANCEL"> </div> </form> </html> I attach the sample imge of my webpage. I am trying to create a simple auto-calculate function for a webpage. What should be happening: The 'onchange' command should pass the 'price' of the item to the function, the function should then cycle through all the dropdowns (or checkboxes or fields) and calculate the total. What is happening: It is only picking up the last checkbox. It seems that the 'for' loop only remembers the last item in the array. What am I doing wrong? How can I get the code to remember all the items? thanks, Code: <script language="JavaScript" type="text/javascript"> function calculateTotal(price) { var total = 0; var cList = ['sel1','sel2','sel3']; for (i=0;i<2;i++); var select = GetE(cList[i]); total+= price * (select.options[select.selectedIndex].value); GetE("totalShow").innerHTML = total.toFixed(2); } function GetE(id) {return document.getElementById(id); } </script> <html> <head></head><body> <form id="form1" name="form1" method="post" action=""> <select name="sel1" id="sel1" onchange="calculateTotal(100)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> <select name="sel2" id="sel2" onchange="calculateTotal(200)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> <select name="sel3" id="sel3" onchange="calculateTotal(300)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> </form> <br>total <span id="totalShow">0.00</span> </body></html> I am looking for a javascript code for this idea under this message ---------------------------------------------------------------------------------------------------------------------------------------------------- I want to create a kind of shopping website so when you click on a image or text it will add some text to a textarea,, it will include the name of item and price of an item I have a web page that loads and Auto scrolls to the end. I need to either auto scroll up, or when it reaches the bottom auto refreshes back to the top. I have had to define a length longer than the document or I get scroll bars and the Iframe won't scroll. Here is the code. [Code] <html> <head> <script type="text/javascript" language="JavaScript" ></script> <title>How to Scroll the Page With JavaScript</title> <meta name="description" content="How to scroll the page automatically using JavaScript." /> <meta name="keywords" content="javascript, page, scroll" /> <script type="text/javascript"> function pageScroll() { window.scrollBy(0,25); scrolldelay = setTimeout('pageScroll()',5000); // scrolls every 1000 milliseconds } </script> </head> <iframe src="file:///D:/PrivateDocs/WorkflowPage/Stinkyxml.htm" name="frame1" scrolling="auto" frameborder="no" style="float:left" height="4500" width="100%"> <body onLoad="pageScroll()"></body> </iframe> <body> <body onLoad="pageScroll()"></body> </body> </html> [icode] Looking for an example of how to take the value typed in one textbox to be calculated and update the value of a second texbox on the fly. The calculation is, (2.9% X first textbox value) + $0.30 = second textbox value Hello, I don't know if this can be done in Javascript, or requires any other language but i was wondering if this would be possible. I would like to embed this Javascript code in to a PHP file and then for it to run automatically upon the PHP file loading: Code: <td class="smallDesc"> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </td> The Javascirpt is the Facebook Share button that basically allows users that have Facebook to share the page there currently on in their Facebook status by pressing the button, but if there not logged in it shows the login page, not a problem just continue the script. The current button i which is what i want to load automatically in the PHP file is located here, to test the functionalilty just click "Share" button in blue.. http://watch-movies-online.anyfilman...-Movie-17.html To summarise, i would like the above Javascript code to execute automatically upon pageload of this PHP file.. http://www.watch-movies-online.anyfi...p://google.com. If that could be done, and if this also is possible.. i would like for the "Share" button on the external page that is loaded from the Javascript code above to be clicked automatically so in effect when ever someone visits the PHP page after clicking "Click Here to Watch/Stream 2012 Online For Free" on this page it will automatically load the Facebook Share box, and automatically click the "Share" Button and then close the page if possible, but not required. Please feel free to ask any questions, i'll be happy to answer. Thanks in advance. Best Regards, Jonathan. Hey all! I have a script below that is very basic. when a user submits a blank form this popups. although i want to set the value of the input field to 'you@domain.com'. how would i add this value to this javascript so that even though there is 'you@domain.com' in the box, an error will still popup?? Thanks, Code: function validate(form_id,email) { var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; var address = document.forms[form_id].elements[email].value; if(reg.test(address) == false) { alert('Please enter a valid email address'); return false; } } |