Question: Below is the current problem I am working on for a JavaScript class (as well as the HTML and JavaScript) - to me it looks

Below is the current problem I am working on for a JavaScript class (as well as the HTML and JavaScript) - to me it looks like all my code looks right but I can't get the application to work at all (hence something is wrong - my if/else or calculations?) Can anyone tell me where I am going wrong in my JavaScript?

1. In the JavaScript file, write the code for calculating and displaying the salestax and invoice total when the user clicks on the Calculate button.

2. If you havent already done so, add data validation to this application. Thesubtotal entry should be a valid, positive number thats less than 10,000. Thetax rate should be a valid, positive number thats less than 12. The errormessages should be displayed in the span elements to the right of the textboxes, and the error messages should be:

"Must be a positive number less than $10,000" and "Must be a positive number less than 12.

3. Add JavaScript code that moves the cursor to the Subtotal field when the application starts and when the user clicks on the Calculate button.

4. Add the JavaScript event handler for the click event of the Clear button. This should clear all text boxes, restore the starting messages, and move the cursor to the Subtotal field.

5. Add JavaScript event handlers for the click events of the Subtotal and Tax Rate text boxes. Each handler should clear the data from the text box.

HTML

Sales Tax Calculator

Sales Tax Calculator

Enter Subtotal and Tax Rate and click "Calculate".

Enter order subtotal

Enter sales tax rate (99.9)




JavaScript

var $ = function (id) { return document.getElementById(id); } var calculateClick = function () { var subtotal = parseFloat( $("subtotal").value ); var taxRate = parseFloat( $("tax_rate").value ); var isValid = true; $("salesTax").value = ""; $("total").value = ""; //error messages - data validation if (isNaN(subtotal) || subtotal <= 0 || subtotal > 10000) { document.getElementById("subtotal_message").innerHTML = "Must be a positive number less than $10,000"; isValid = false; } else (isNaN(taxRate) || taxRate <= 0 || taxRate > 12) { document.getElementById("tax_rate_message").innerHTML = "Must be a positive number less than 12"; isValid = false; } //calculate sales tax and total if valid entries if (isValid) { var salesTax = subtotal * (taxRate / 100); salesTax = parseFloat(salesTax.toFixed(2)); var total = subtotal + salesTax; $("salesTax").value = salesTax; $("total").value = total.toFixed(2); } }

//clear text boxes var clearClick = function () { $("subtotal").value = ""; $("taxRate").value = ""; $("salesTax").value = ""; $("total").value = ""; //restore starting messages $("subtotal_message").innerHTML = "Enter order subtotal"; $("tax_rate_message").innerHTML = "Enter sales tax rate (99.9)"; //set focus to subtotal box $("subtotal").focus(); }

var clearSubtotal = function () { $("subtotal").value = ""; } var clearTax = function() { $("taxRate").value = ""; }

window.onload = function () { $("calculate").onclick = calculateClick; $("clear").onclick = clearClick; $("subtotal").ondblclick = clearSubtotal; // double click to clear the subtotal box $("taxRate").ondblclick = clearTax; // double click to clear the tax rate box $("subtotal").focus(); // sets the focus to the subtotal box

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!