JavaScript - Final Grading System - Calculating Final Grade?
I am trying to create a grading calculator which will prompt the user to enter specific data and calculate the final grade.
Here is code which I modified from an earlier post from Philip M. Code: <script type = "text/javascript"> var count = 1; var total = 0; var info= new Array(); var numGrades = 2; for (var i = 0; i<numGrades; i++) { var repeat = true; while(repeat) { var ans = parseInt (prompt("Enter grade between 0%-100% for Grade # "+ count,"")); if ((isNaN(ans)) || (ans == null) || (ans < 1) || (ans > 100)) { alert ("You must enter a number between 0 and 100"); } else { repeat = false; count ++; info[i] = ans; total = total + info[i]; } } } var avg = total/info.length; for (var i = 0; i < info.length; i++) { document.write("Grade " + (i+1) + " Marks = " + info[i] + "<br>"); } document.write("<br> Average Mark = " + avg.toFixed(2)) </script> Here is the hard part: I am trying to make it so it will first ask how many grades to be calculated rather than a fixed grade. Then it will ask for grade 1 how many grades to be calculated for grade 1 and there percentage. Example: (alert box) How many overall grades to be calculated? User types 2 (alert box) Grade1 how many quizzes to be calculated? User types 2 (alert box) quiz 1 how much percent is this worth out of 100%? User types 80% (alert box) What grade did you receive? (alert box) quiz2 how much percent is this worth out of 100%? User types 20% (alert box) What grade did you receive? (alert box) Grade2 how many quizzes to be calculated? User types 1 (alert box) quiz 1 how much percent is this worth out of 100%? User would type 100% (alert box) What grade did you get? And then the results should look something like this: Grade 1 you got an 86% Grade 2 you got an 91 Final grade = ….. This is probably just a dumb way of doing this so anyway which will get the same result will be fine. I'm not sure if alert box is the wrong way to go. Similar TutorialsNeed a little help with the final code on my project. I'm multiplying 3 drop downs to give me a total sq ft. I then want to take that variable and multiply it by a fixed number. i.e. qty*width*length equals a total of 8 sq ft, then take that 8 and multiply it by a fixed number (8*1.75), I want it to calculate without any submit buttons and show the total sq ft and the final value. thanks in advance for any assistance. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=unicode"> <form> <meta content="MSHTML 6.00.2900.5921" name="GENERATOR"></head> <body><strong>Quantity:</strong> <select id="qty" onchange="Calculate();" size="1" name=qty><option value="1" selected>1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value=5>5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value=10>10</option> <\SELECT></select> <strong>Banner Width:</strong> <select id="height" onchange="Calculate();" size="1" name=height><option value="2" selected>2</option> <option value="3">3</option> <option value="4">4</option> <\SELECT></select> <strong>Banner Length:</strong> <select id="length" onchange="Calculate();" size="1" name="length"><option value="4" selected>4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <\SELECT></select> <strong>Total sq ft: <font size=4><label id="lblRes"><!-- a Label to locate result in it -->8 </label></form></font></span></span></font> <p></p></span></span></font></font></strong> <div></div> <script language="javascript"> function Calculate() { var h = document.getElementById('height').value; var l = document.getElementById('length').value; var q = document.getElementById('qty').value; var result = h * l * q; document.getElementById('lblRes').innerHTML = result; } </script> </font></strong></body></html> Hi, i have a complete validation code here which seems not working properly.When i filled the full name filed and i click submit, the form get submitted but when i filled the full name and filled email too and click on submit the third or fourth like country alert or helpmessage pop up. Now i am trying to fish out why it is doing that but i am not getting it now. please i know its a long code but please try to help me on where i am wrong. I will thank you for using blue thank Please i will suggest copy the code i see what i mean.Here is it Code: <html> <head> <title>Final form validation</title> <script type="text/javascript"> function formvalidator() { var Fullname=document.getElementById("Fullname"); var email=document.getElementById("email"); var addr=document.getElementById("addr"); var country=document.getElementById("country"); var zip=document.getElementById("zip"); var phone=document.getElementById("phone"); var educa=document.getElementById("educa"); var job=document.getElementById("job"); var hours=document.getElementById("hours"); if(Checkfullname(Fullname,"Please enter your full name.")){ if(Checkemail(email,"Please enter a valid email.")){ if(Checkaddr(addr,"Please enter your address for better contact.")){ if(Checkcountry(country,"Please select a country.")){ if(Checkzip(zip,"Please enter your area zip code of 5 digits.")){ if(Checkph(phone,"Please enter your phone number for better contact of 14 digits.")){ if(Checkeduca(educa,"Please select your education status.")){ if(Checkjob(job,"Please select job.")){ if(Checkhours(hours,"Please select the number of hours you want to work." )){ return true; }}}}}}}}} return false; } function Checkfullname(elem,helpmg) { var eval=elem.value; eval=eval.replace(/[^a-z\s\-\.\']/gi,""); eval=eval.replace(/^\s+|\s+$/g,""); eval=eval.replace(/\s{2,}/g," "); eval=eval.toLowerCase().replace(/\b[a-z]/g,function(w){return w.toUpperCase()}); document.getElementById("Fullname").value=eval; if(eval.length>=5 && eval.length<=50){ return true; } else{ alert(helpmg); elem.focus(); return false; }} function Checkemail(elem,help) { var eReExp=/^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/; if(elem.value.match(eReExp)){ return true; } else{ alert(helpmg); elem.focus(); return false; }} function Checkaddr(elem,helpmg) { var eval=elem.value; eval=eval.replace(/^\s+|\s+$/g,""); eval=eval.replace(/\s{2,}/g," "); document.getElementById("addr").value=eval; if(elem.value.replace(elem.value)){ return true; } else{ alert(helpmg); elem.focus(); return false; }} function Checkcountry(elem,helpmg) { if(elem.value=="Please select country"){ alert(helpmg); elem.focus(); return false; } return true; } function Checkzip(elem,helpmg) { var zReExp=/^\d{5}$/; if(elem.value.match(zReExp)){ return true; } else{ alert(helpmg); elem.focus(); return false; }} function Checkph(elem,helpmg) { var pReExp=/^\d{14}$/; if(elem.value.match(pReExp)){ return true; } else{ alert(helpmg); elem.focus(); return false; }} function Checkeduca(elem,helpmg) { if(elem.value=="Please choose"){ alert(helpmg); elem.focus(); return false; } return true; } function Checkjob(elem,helpmg) { if(elem.value=="Please select job"){ alert(helpmg); elem.focus(); return false; } return true; } function Checkhours(elem,helpmg) { if(elem.value=="Please select hours"){ alert(helpmg); elem.focus(); return false; } return true; } </script> <style type="text/css"> #fullpage{width:100%;background-color:#f3f3f3; border:1px solid #336699;} #firstbar{ width:100%; background-color:#336699; text-align:left; font-color:white; } #field{ margin-right:70%;text-align:right;} </style> </head> <body> <h2><font color=#336699>Form validation..The power of javascript<font></h2> <p><font clor=#336699>Please note:all the field marked asteric is required and must be field.<br/>For help on filling the form just contact as at support@jobs.com.<font></p> <hr width="100%" color="#336699" size="2"> <div id="fullpage"> <form onsubmit="return formvalidator()"/> <div id="firstbar"><p><font color="white">Personal Details</font></p></div> <div id="field"> <p><font color=red>*</font>Full Name<input type="text" id="Fullname"/></p> <p><font color=red>*</font>Email<input type="text" id="email"/></p> <p><font color=red>*</font>Contact Address<input type="text" id="addr"/></p> <p><font color=red>*</font>Country<select id="country"/> <option>Please select country</option> <option>Ghana</option> <option>United States</option> <option>India</option> <option>Germany</option> <option>Italy</option> <option>Nigeria</option> <option>South Africa</option> <option>United kingdom</option> <option>Malasia</option> <option>Egypt</option> <option>France</option> <option>China</option> </select></p> <p><font color=red>*</font>Zip Code<input type="text" id="zip"/></p> <p><font color=red>*</font>Phone Number<input type="text" id="phone"/></p> <p>Fax Number<input type="text" name="fax"/></p> </div> <div id="firstbar"><p><font color="white">Educational Details & Job</font></p></div> <div id="field"> <p><font color=red>*</font>Education Status<select id="educa"/> <option>Please choose</option> <option>High School</option> <option>Diploma</option> <option>Degree</option> <option>Certified We Developer</option> <option>Certified We Designer</option> <option>others</option> </select></p> <p>Experience(Details if any)<input type="text" name="exp"/></p> <p><font color=red>*</font>Job Type<select id="job"/> <option>Please select job</option> <option>We Developer</option> <option>Web Designer</option> <option>Softwar Developer</option> <option>IT Consultancy</option> <option>Stock Trader</option> <option>Marketing Position</option> </select></p> <p><font color=red>*</font>Working Hours<select id="hours"/> <option>Please select hours</option> <option>1 to 5hurs</option> <option>1 to 8hurs</option> <option>1 to 10hurs</option> <option>1 to 12hurs</option> <option>1 to 13hurs</option> <option>1 to 15hurs</option> <option>1 to 20hurs</option> </select><p/> <p>Salary Demanded<input type="text" name="sala"/></p> <p>Comment(if any)<textarea name="text" rows="3" cols="40" wrap="virtual"/></textarea></p> <input type="submit" value="Submit Form"/> <input type="reset" value="Reset Form"/> </div></div> </form> </body> </html> Thanks.Clement Osei. Hey thanks in advance to anyone who can take a peak at my code and hopefully point me in the correct direction. I have been working on my final project in my javascript class for a bit, and there are a few erros I cant seem to find through firebug or error console. It is due this evening at midnight, so anyone that could help, I really need this assignment for a decent grade. Basically there are two issues so far, one needs to be solved so the other can be as well. First, line 103 - 105 should create a hyperlink to the specified id, but is doesn't return a number. so the link goes no where it is this code: PHP Code: //create hypertext link to the section heading var linkItem = document.createElement("a"); linkItem.innerHTML = n.innerHTML; linkItem.href = "#" + n.id; Next I belive there is a problem with the function expandCollapseDoc(), that might fix itself when the other problem is solved. The document should expand and collapse with the menu. Here is my javascript code: PHP Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 7 Tutorial Case Author: Mike Cleghorn Date: 2-15-10 Filename: toc.js Global Variables: sections An array contain the HTML elements used as section headings in the historic document Functions List: addEvent(object, evName, fnName, cap) Adds an event hander to object where evName is the name of the event, fnName is the function assigned to the event, and cap indicates whether event handler occurs during the capture phase (true) or bubbling phase (false) makeTOC() Generate a table of contents as a nested list for the contents of the "doc" element within the current Web page. Store the nested list in the "toc" element. levelNum(node) Returns the level number of the object node. If the object node does not represent a section heading, the function returns the value -1. createList() Goes through the child nodes of the "doc" element searching for section headings. When it finds a section heading, a new entry is added to the table of contents expandCollapse() Expands and collapse the content of the table of contents and the historic document expandCollapseDoc() Goes through the child nodes of the "doc" element determining which elements to hide and which elements to display isHidden(object) Returns a Boolean value indicating whether object is hidden (true) or not hidden (false) on the Web page by examining the display style for object and all its parent nodes up to the body element */ function addEvent(object, evName, fnName, cap) { if (object.attachEvent) object.attachEvent("on" + evName, fnName); else if (object.addEventListener) object.addEventListener(evName, fnName, cap); } addEvent(window, "load", makeTOC, false); var sections = new Array("h1","h2","h3","h4","h5","h6"); var sourceDoc; //document on which TOC is based on function makeTOC(){ var TOC = document.getElementById("toc"); TOC.innerHTML = "<h1>Table of Contents</h1>"; var TOCList = document.createElement("ol"); TOC.appendChild(TOCList); sourceDoc = document.getElementById("doc"); //generate list items containing section headings createList(sourceDoc, TOCList); } function levelNum(node) { for (var i = 0; i < sections.length; i++) { if(node.nodeName == sections[i].toUpperCase()) return i; } return -1; //node is not section heading } function createList(object, list) { var prevLevel = 0; //level of the pervious TOC entry var headNum = 0; //running count of headings for (var n = object.firstChild; n != null; n = n.nextSibling) { //loop through all nodes in object var nodeLevel = levelNum(n); if (nodeLevel != -1) { //node represents a section heading //insert id for the section heading if necessary headNum++; //create list item to match var listItem = document.createElement("li"); listItem.id = "TOC" + n.id; //create hypertext link to the section heading var linkItem = document.createElement("a"); linkItem.innerHTML = n.innerHTML; linkItem.href = "#" + n.id; //append the hypertext to the list entry listItem.appendChild(linkItem); if (nodeLevel == prevLevel) { //append the entry to the current list list.appendChild(listItem); } else if (nodeLevel > prevLevel) { //append entry to new nest list var nestedList = document.createElement("ol"); nestedList.appendChild(listItem); list.lastChild.appendChild(nestedList); //add plus/minus box beffore the text var plusMinusBox = document.createElement("span"); plusMinusBox.innerHTML = "--"; addEvent(plusMinusBox, "click", expandCollapse, false) nestedList.parentNode.insertBefore(plusMinusBox, nestedList.previousSibling); list = nestedList; prevLevel = nodeLevel; } else if (nodeLevel < prevLevel) { //append entry to a higher-level list var levelUp = prevLevel - nodeLevel; for (var i = 1; i<= levelUp; i++) {list = list.parentNode.parentNode;} list.appendChild(listItem); prevLevel = nodeLevel; } } } } function expandCollapse(e) { var plusMinusBox = e.target || event.srcElement; var nestedList = plusMinusBox.nextSibling.nextSibling; //Toggle the plus and minus symbol if (plusMinusBox.innerHTML == "--") plusMinusBox.innerHTML = "+" else plusMinusBox.innerHTML = "--"; //Toggle display of nested list if(nestedList.style.display == "none") nestedList.style.display = "" else nestedList.style.display = "none"; //expand/collapse doc to match TOC expandCollapseDoc(); } function expandCollapseDoc() { var displayStatus = ""; for (var n = sourceDoc.firstChild; n != null; n = n.nextSibling) { var nodeLevel = levelNum(n); if (nodeLevel != -1) { //determain display status of TOC entry var TOCentry = document.getElementById("TOC" + n.id); if (isHidden(TOCentry)) displayStatus = "none" else displayStatus = ""; } if (n.nodeType == 1) { //apply to current status for the node n.style.display = displayStatus; } } } function isHidden(object) { for (var n = object; n.nodeName != "BODY"; n = n.parentNode) { if (n.style.display = "none") return true; } return false; } the html was too long, so i uploaded it to my webspace you can check out the almost working version at http://www.kinetic-designs.net/final/usconst.htm Again thank you so much! Any questions just ask! i wold like to get this working. when a user enters 4 grades into the text boxes. it would give them the Avg Grade and also what Mark they got, and if they failed one out put the module they most Repeat and if they passed all out put a smiley face.. This is what i have so far.. Code: function compute() { var c = document.getElementById("c").value; var computer = document.getElementById("computer").value; var web = document.getElementById("web").value; var math = document.getElementById("math").value; document.getElementById("cost").value = totalCost = (c * 100 + computer * 100 + web * 100 + math * 100 ) /4; if(cost >=93) alert(" You got an A+") else if((cost >=85)&(grade <93)) alert(" You got an A") else if((cost >=78)&(grade <85)) alert(" You got an B") else if((cost >=60)&(grade <78)) alert(" You got an C") else if((cost >=40)&(grade <60)) alert(" You got an D") else if(cost <40) alert(" You Failed this Module") </script> </head> <body> <form method="get" action="" onsubmit='return formValidator()' > <fieldset id="personalInfo"> <h3> Student Results </h3> <!-- A bordered table for item orders --> <table border = "border"> <!-- First, the column headings --> <tr> <th> Module Name </th> <th> Pass Mark </th> <th> Final Mark </th> </tr> <!-- Now, the table data entries --> <tr> <th> C++ </th> <td> 40 % </td> <td> <input type = "text" id = "c" size ="10" /> </td> </tr> <tr> <th> Computer Systems </th> <td> 40 % </td> <td> <input type = "text" id = "computer" size = "10" /> </td> </tr> <tr> <th> Web Development </th> <td> 40 % </td> <td> <input type = "text" id = "web" size = "10" /></td> </tr> <tr> <th> Maths </th> <td> 40 % </td> <td> <input type = "text" id = "math" size ="10" /> </td> </tr> </table> <!-- Button for precomputation of the total cost --> <p> <input type = "button" value = "Total Grade" onclick = "compute();" /> <input type = "text" size = "5" id = "cost" onfocus = "this.blur();" /> </p> </fieldset> </p> <input type='submit' value='Check Form' /> </form> </body> </html> I have this project i have to complete for class, that i cant figure out. this is what the project says: Prompt the user for the grades of 10 students with one prompt for each grade with the prompting text being: "Enter grade between 1 and 10 for student n:" where n varies from 1 to 10. If the grade input is not between 1 and 10, please prompt again for the grade. Once the user is done, it prints a report telling you the grade of each individual student and the average of the ten grades. The individual student grade should be in different lines with the text "Grade for student n is x". The average should also be in a different line with the text "Average grade is y". The average grade should not be rounded off. my problem is i cant figure out how to write each individual grade (from 1 through 10), and display it on the page. i have this code from a similar project, i tried to ammend it for this code but i always end up ruining it any tips on how to display each grade (1-10)? or how to verify that the user only enters grades between 1 and 10 Code: <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title>Class Average Program: Sentinel-controlled Repetition</title> <script type = "text/javascript"> <!-- var total; // sum of grades var gradeCounter; // number of grades entered var grade; // grade typed by user (as a string) var gradeValue; // grade value (converted to integer) var average; // average of all grades // Initialization phase total = 0; // clear total gradeCounter = 0; // prepare to loop // Processing phase // prompt for input and read grade from user grade = window.prompt( "Enter Integer Grade, -1 to Quit:", "0" ); // convert grade from a String to an integer gradeValue = parseInt( grade ); while ( gradeValue != -1 ) { // add gradeValue to total total = total + gradeValue; // add 1 to gradeCounter gradeCounter = gradeCounter + 1; // prompt for input and read grade from user grade = window.prompt( "Enter Integer Grade, -1 to Quit:", "0" ); // convert grade from a String to an integer gradeValue = parseInt( grade ); } // end while // Termination phase if ( gradeCounter != 0 ) { average = total / gradeCounter; // display average of exam grades document.writeln( "<h1>Class average is " + average + "</h1>" ); } // end if else document.writeln( "<p>No grades were entered</p>" ); // --> </script> </head> <body> <p>Click Refresh (or Reload) to run the script again</p> </body> </html> Hello, I'm new here and a newbie to the world of java script. I am taking a CIT class and we just moved on to java script which i am having trouble with. My assignment is to calculate the average, number of passed, and number of failed grades according to this list (65, 80, 85, 55, 90, 70, 62, -1) where it terminates at -1 and the passing grade is >=70. Any help is appreciated! I now have the calculation, topic can be closed! thanks to be honest I have no idea where to start, i have a table, with 2 numeric values at the minute, if the checkbox is selected I want the total price to be shown? Any help to get me started would be great! this is the form I have with the numeric values Code: <form id="calculation" action="#" method="post"> 100 <input type="checkbox" name="check1" value="100" onClick='total_cost()'/> 120 <input type="checkbox" name="check2" value="200" onClick='total_cost()'/> Total cost<input type="text" name="total" id="total" readonly="readonly" /> onClick='total_cost()' is referring to the javascript function where I just don't know where to start? Hi, I am trying to write a script that will take a date of birth and another date and, if the person was over 75 years old on the createdDate, return "true" (otherwise return "false"). Unfortunately my code doesn't seem to return either 'true' or 'false'! Any help would be grately appreciated. The code is: Code: var dateofBirth="30/10/1982"; var createdDate="01/12/2010"; var sd = dateofBirth.split('/'); var dob = new Date(sd[2],sd[1],sd[0]); sd = createdDate.split('/'); var submit = new Date(sd[2],sd[1],sd[0]); var age=submit-dob; var ageYears=Math.floor((((age/3600000)/24)+1)/365.25); if(ageYears>75) document.write("true") else document.write("false") ; Hello everyone. Below is code I have developed for a simple spreadsheet. The issue I am having is that when I total a row or column using "=sum(a1:a5)" and then I try and total another row and add the sum of the two totals together I am not getting a valid response back. All I am presented with is a "0" in the column cell. Here is the code in two files and have also included an attachment of the whole project: tablepage.js Code: // JavaScript Document var tblRows = 20; var tblColumns = 10; var tblArray = new Array(tblRows); var p = window.parent; // Initial page event handler function initPage() { p.refAssignCellFromTextbox = assignCellFromTextbox; for (var i = 0; i < tblArray.length; i++) { tblArray[i] = new Array(tblColumns); for (var j = 0; j < tblArray[i].length; j++) tblArray[i][j] = "0"; } recalculate(); } // Recalculate cell values function recalculate() { for (var i = 0; i < tblRows; i++) { for (var j = 0; j < tblColumns; j++) { if (tblArray[i][j].indexOf("=SUM") != -1) { calculateCell(i, j); } } } } // Click cell event handler function clickCell(cellRef) { thisRef = cellRef; var cellID = cellRef.id; var row = parseFloat(cellID.substr(0, 3)) - 1; var column = parseFloat(cellID.substr(3, 2)) - 1; var cellValue = tblArray[row][column]; var tokenArray = getFormula(cellValue); if (tokenArray != null) p.assignTextboxFromArray(cellValue); else p.assignTextboxFromCell(cellRef); } // Update cell from textbox function assignCellFromTextbox(tblValue) { if (thisRef != undefined) { if (tblValue == "") { tblValue = "0"; } var tokenArray = getFormula(tblValue); if (tokenArray != null) { assignArray(thisRef.id, tblValue.toUpperCase()); } else { if (!isFloat(tblValue)) { parseValue = tblValue.replace(/[^0-9]/g, ''); tblValue = parseValue; } assignArray(thisRef.id, tblValue); if (tblValue == "0") thisRef.innerText = ""; else thisRef.innerText = tblValue; } recalculate(); } } // Determines if a user entered a formula function getFormula(tblValue) { var pattern = /[:|\(|\)]/; var ar = tblValue.split(pattern); var sum = ar[0].toUpperCase(); if (ar.length < 3) return null; else if (sum != "=SUM") { return null; } else { return ar; } } function assignArray(cellID, tblValue) { var row = parseFloat(cellID.substr(0, 3)); var column = parseFloat(cellID.substr(3, 2)); tblArray[row - 1][column - 1] = tblValue; } function calculateCell(row, column) { var tokenArray = getFormula(tblArray[row][column]); if (tokenArray != null) { var fromColumn = tokenArray[1].substr(0, 1); var fromRow = tokenArray[1].substr(1, tokenArray[1].length - 1); var toColumn = tokenArray[2].substr(0, 1); var toRow = tokenArray[2].substr(1, tokenArray[2].length - 1); var fromRowIndex = parseFloat(fromRow) - 1; var fromColIndex = fromColumn.charCodeAt(0) - 65; var toRowIndex = parseFloat(toRow) - 1; var toColIndex = toColumn.charCodeAt(0) - 65; var sumTotal = 0; for (var i = fromRowIndex; i <= toRowIndex; i++) { for (var j = fromColIndex; j <= toColIndex; j++) { if (isFloat(tblArray[i][j])) sumTotal += parseFloat(tblArray[i][j]); } } var cellID = fillField((row + 1).toString(), 3) + fillField((column + 1).toString(), 2); document.getElementById(cellID).innerText = sumTotal; } } function isFloat(s) { var ch = ""; var justFloat = "0123456789."; for (var i = 0; i < s.length; i++) { ch = s.substr(i, 1); if (justFloat.indexOf(ch) == -1) return false; } return true; } function fillField(s,n) { var zeros = "0000000000"; return zeros.substring(0, n - s.length) + s; } spreadsheet.js Code: // JavaScript Document var refAssignCellFromTextbox; var nCharsAllowed = "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890.=(): "; // Event Handler function initPage() { document.getElementById("TableFrame").style.top = "50px"; document.getElementById("TableFrame").src = "tablepage.html"; } // Updates text field when a user clicks on a particular field from with the spreadsheet function assignTextboxFromCell(cValue) { document.getElementById("fieldEntry").value = cValue.innerText; document.getElementById("fieldEntry").focus(); } // Assists tablepage.js with updating a value from a 2D array function assignTextboxFromArray(aValue) { document.getElementById("fieldEntry").value = aValue; document.getElementById("fieldEntry").focus(); } // Used when a user presses a key to update text field function filterText() { if (window.event.keyCode != 13) { if (!nCharOK(window.event.keyCode)) window.event.keyCode = null; } else { window.event.keyCode = null; refAssignCellFromTextbox(document.getElementById("fieldEntry").value); } } // Checks to see if character entered falls within our preset function nCharOK(c) { var ch = (String.fromCharCode(c)); ch = ch.toUpperCase(); if (nCharsAllowed.indexOf(ch) != -1) return true; else return false; } // Clears all data from the screen function clearPage() { initPage(); document.getElementById("fieldEntry").value = ""; } // Add a row to the table function addRow(frmTable) { var table = document.getElementById(frmTable); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell1 = row.insertCell(0); // cell2.innerHTML = rowCount + 1; // Unless this is going to be completely dynamic // the rest of the table code would have had to be // entered in statically. Not happening. } // Delete a row from the table function deleteRow(frmTable) { try { var table = document.getElementById(frmTable); 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) { table.deleteRow(i); rowCount--; i--; } } } catch(e) { alert(e); } } Hi, There are two text boxes in a HTML form. The first text box takes the time when the user starts to work on a project. The second box takes the time when the user stops working on that project. Now, I would like to calculate the total time worked on that project for that user. That is (stop time - start time). I tried few things without success. Any help will be appreciated. Hi! I'm very new to javascript and a bit stuck with trying to calculate values from functions together. Let's say I have three functions. Each function is given a value and the goal is to calculate all the values together in a variable. This is what I have so far: Code: function numberAdd1 () { addValue = 1; return.addValue; } function numberAdd2 () { addValue = 2; return.addValue; } function numberAdd3 () { addValue = 3; return.addValue; } How would I now calculate the return value of each funtion together and store the result in a variable? Hey there, first time poster. I am trying to create an order with the ability to dynamically self total the sum of the selected items but also be able to add a 25% labor fee having it be at least $90. So if someone buys $300 worth of items the labor charge would be $75 but it would be automatically bumped to $90. heres the existing code: PHP Code: * Calculates the payment total with quantites * @param {Object} prices */ countTotal: function(prices){ var total = 0; $H(prices).each(function(pair){ total = parseFloat(total); var price = parseFloat(pair.value.price); if ($(pair.key).checked) { if ($(pair.value.quantityField)) { price = price * parseInt($(pair.value.quantityField).getSelected().text, 10); } total += price; } }); if (total === 0) { total = "0.00"; } if ($("payment_total")) { $("payment_total").update(parseFloat(total).toFixed(2)); } }, /** * Sets the events for dynamic total calculation * @param {Object} prices */ totalCounter: function(prices){ $H(prices).each(function(pair){ $(pair.key).observe('click', function(){ JotForm.countTotal(prices); }); if ($(pair.value.quantityField)) { $(pair.value.quantityField).observe('change', function(){ $(pair.key).checked = true; JotForm.countTotal(prices); }); } }); }, I'm trying to find the difference between 2 times. Time formats are 00:00:00.0 For example... var t1 = "00:07:51.0"; var t2 = "00:53:21.0"; How do I calculate the difference between those 2 times? TIA. Calculating the difference between two dates in JavaScript is relatively straightforward, provided you choose the right Date methods to work with. Whichever way you get there.... see this http://www.tutorials99.com/tutorials...aScript/page_1 I thought this would be simple. Evidently it's not With the date below (and it being 11.45 on the 27th as I type this), the counter returns the correct number of hours/mins/seconds remaining, but shows 33 days. It seems to be adding 31 days to the count, but I can't figure out where Code: function countdown(){ var bigday = new Date(2009,10,29,14,30,0,0); var today = new Date(); var difference = bigday - today; var remaining = Math.floor(difference/1000); // want seconds, not milliseconds var days = Math.floor(remaining/86400); remaining = remaining % 86400; var hours = Math.floor(remaining/3600); remaining = remaining % 3600; var minutes = Math.floor(remaining/60); remaining = remaining % 60; seconds = Math.floor(remaining); var out = days + " days, " + hours + " hours, " + minutes + " minutes and " + seconds + " seconds left..."; $('#countdown').text(out); setTimeout(countdown, 1000); } I am having difficulty getting the following assignment to run properly: Many companies charge a shipping and handling charge for purchases. Create a Web page that allows a user to enter a purchase price into a text box and includes a JavaScript function that calculates shipping and handling. Add functionality to the script that adds a minimum shipping and handling charge of $1.50 for any purchase that is less than or equal to $25.00. For any orders over $25.00, add 10% to the total purchase price for shipping and handling, but do not include the $1.50 minmum shipping and handling charge. The formula for calculating a percentage is price * percent / 100. For example, the formula for calculating 10% of a $50.00 purchase price is 50 * 10 / 100, which results in a shipping and handling charge of $5.00. After you determine the total cost of the order (purchase plus shipping and handling), display it in an alert dialog box. Save the document as CalcShipping.html. This is what I have after working on it round and round for 4 hours yesterday: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Calculate Order</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" href="js_styles.css" type="text/css" /> <script type="text/javascript"> /* <![CDATA[ */ function applyShipping(shipping) { if (purchase > 25.00) shipping = purchase * 10 / 100; } /* ]]> */ </script> </head> <body> <script type="text/javascript"> /* ![CDATA[ */ document.write("<h1>Purchase Plus Shipping</h1>"); /* ]]> */ </script> <script type="text/javascript"> /* <![CDATA[ */ var purchase=window.prompt("Please Enter Your purchase amount"); var shipping = 1.50; applyShipping(); document.write ("<p>The price entered was $" + (purchase) + "</p>"); document.write ("<p>Shipping and Handling $" + (shipping) + "</p>"); var totalPrice = purchase + shipping; document.write ("<p>Your total price is $" + (totalPrice) + "</p>"); // window.alert("Your total price is $" + (totalPrice) + );// /* ]]> */ </script> </body> </html> Hi guys Sorry about the vague Title, but I really do not know anything about JavaScript. Infact I only know very VERY basic html... So I hope you can help me. I am trying to create a form like this: Where the blue is user entered, and red is results. Apparently I can't do that with my basic html skills but javascript can? The Formula via excel for 'Generic SOP' is =100-((ABS(A3-10))+(ABS(B3-10))+(ABS(C3-10))+(ABS(D3-10))+(ABS(E3-10))+(ABS(A6-10))+(ABS(B6-10))+(ABS(C6-10))+(ABS((D6-20)/2))+(ABS(E6-10))) and for 'SOP' =100-((ABS(A3-10)*1.5)+(ABS(B3-10)*1)+(ABS(C3-10)*1)+(ABS(D3-10)*2)+(ABS(E3-10)*1)+(ABS(A6-10)*0.5)+(ABS(B6-10)*0.5)+(ABS(C6-10)*1)+(ABS(D6-20)/2)+(ABS(E6-10)*0.5)) I would also like a drop down box that allows me to choose different variables that changes the 'SOP' formula slightly.. but maybe I should leave that out for now.. I hope that was understandable and if this is too much to ask just tell me to get nicked and go learn how to code myself.. Thankyou for looking guys Can someone please assist. I am trying to create a order form that auto calculates my totals as I enter the quantities. It comes up with Not a Number(NaN). Below are snippets from my code this is obviously in a <form>: HTML: Code: <!-- Row 3, Col 3 purchase boxes --> <td colspan="1" height="120" align="left"> <input style="margin-left: 60px" type="text" name="bed_359" size="3" maxlength="3" onchange="calculateValue(this.form)" /> R359</td></tr> <!-- Row 10, Col 2 Order Value Box--> <td colspan="1" align="left"><input style="margin-left: 60px" type="text" name="total" size="10" onfocus="this.form.elements[0].focus()" /> </td></tr> javaScript: Code: // Function to calculate order value function calculateValue(orders) { var orderValue = 0; var value = 0; var itemPrice = 0; var itemQuantity = 0; // Run through all the product fields for(var i = 0; i < orders.elements.length; ++i) { // Get the current field formField = orders.elements[i]; // Get the fields name formName = formField.name; // Items price extracted from name itemPrice = parseFloat(formName.substring(formName.lastIndexOf("0") + 1)); // Get the Quantity itemQuantity = parseInt(formField.value); // Update the OrderValue if(itemQuantity >= 0) { value = itemQuantity * itemPrice; orderValue += value; } } // Display the total orders.total.value = orderValue; } Please help its probably something simple. |