Question

In: Computer Science

Develop and test an HTML document that has text boxes for apple (69 cents each), orange...

Develop and test an HTML document that has text boxes for apple (69 cents each), orange (59 cents each), and banana (49 cents each), along with a Submit button. These text boxes take a number, which is the purchased number of the particular fruit. Add a max property value of 99 and a min property value of 0. Add event handlers using the min and max properties to check on values input through the text boxes of the document to ensure that the input values are numbers in the range. Each of the text boxes should have its own onclick event handler. These handlers must add the cost of their fruit to a total cost. An event handler for the Submit button must produce an alert window with the message "Your total cost is $xxx.xx" where xxx.xx is the total cost of the chosen fruit, including 7.75 percent sales tax. This handler must return false (to avoid actual submission of the form data).

Expert Solution

Code:

<!DOCTYPE html>
<html>
<head>
   <title>Shopping Cart</title>
</head>
<body>
   <div>
       <form>
           <label>Apples (69 cents each) : </label>
           <input type="textbox" id="apples" name="apples" value="" min="0" max="99" onkeyup="applemax(this.value);"><br>
           <label>Oranges (59 cents each) : </label>
           <input type="textbox" id="oranges" name="oranges" value="" min="0" max="99" onkeyup="orangemax(this.value);"><br>
           <label>Banana (49 cents each) : </label>
           <input type="textbox" id="bananas" name="bananas" value="" min="0" max="99" onkeyup="bananamax(this.value);"><br>
           <input type="button" id="calculate" value="Submit">
       </form>
   </div>
   <script type="text/javascript">
       function calc() {

           var apple = document.getElementsByName("apples")[0].value;
           var orange = document.getElementsByName("oranges")[0].value;
           var banana = document.getElementsByName("bananas")[0].value;

total = (apple * ".69" + orange * ".59" + banana * ".49" ) * "1.0775";
// The 1.0775 is to calculate the percent sales tax

alert("Your total cost is $" + total.toPrecision(5));
}

function applemax(value)
{

           var maxValue = 99;
           if( value> maxValue ) // checking the value in the text box
           {
               alert("The input can be in the range of 0-99"); // alert if the input is more than 99
               apples.value="0"; // changing the value to 0 if value is more than 99
           }
       }

function orangemax(value)
{

           var maxValue = 99;
           if( value> maxValue )
           {
               alert("The input can be in the range of 0-99");
               oranges.value="0";
           }
       }

function bananamax(value)
{

           var maxValue = 99;
           if( value> maxValue )
           {
               alert("The input can be in the range of 0-99");
               bananas.value="0";
           }
       }

       window.onload = function () {
           document.getElementById("calculate").onclick = calc;
       };

</script>
</body>
</html>

Output:

venereology answered 2 years ago

Develop and test an HTML document to use the DOM 2 event model that has text...

Develop and test an HTML document to use the DOM 2 event model that has text boxes for apple (59 cents each), orange (49 cents each), and banana (39 cents each), along with a Submit button. These text boxes take a number, which is the purchased number of the particular fruit. Add reality checks to the text boxes of the document to ensure that the input values are numbers in the range from 0 to 99. Each of the text...

FOR HTML Web scripting Complete the following: Create and test an HTML document that has six...

FOR HTML Web scripting Complete the following: Create and test an HTML document that has six short paragraphs of text that describe various aspects of the state in which you live. You must define three different paragraph styles, p1, p2, and p3. The p1 style must use left and right margins of 20 pixels, a background color of pink, and a foreground color of blue. The p2 style must use left and right margins of 30 pixels, a background color...

A mail-order house uses 15,950 boxes a year. Carrying costs are 69 cents per box a...

A mail-order house uses 15,950 boxes a year. Carrying costs are 69 cents per box a year, and ordering costs are $100. The following price schedule applies. Number of Boxes Price per Box 1,000 to 1,999 $1.40 2,000 to 4,999 1.30 5,000 to 9,999 1.20 10,000 or more 1.15 a. Determine the optimal order quantity. (Round your answer to the nearest whole number.) b. Determine the number of orders per year. (Round your answer to 2 decimal places.)

Create and test an HTML document for yourself, including your name, address, and electronic mail address....

Create and test an HTML document for yourself, including your name, address, and electronic mail address. If you are a student, you must include your major and your grade level. If you work, you must include your employer, your employer’s address, and your job title. This document must use several headings and <em>, <strong>, <hr />, <p>, and <br /> tags. 2.2 Add pictures of yourself and at least one other image (of your friend, spouse, or pet) 2.3 Add...

You are an apple farmer who sell apples by the boxes. Each box contains 6 Apples....

You are an apple farmer who sell apples by the boxes. Each box contains 6 Apples. You have 30 boxes of apples. Price of each box is $20. Using cout object as studied in the class and by use of algorithm(s), display following in the format as written below: 1. Total number of apples in all boxes are ______________ 2. Total apples will be sold for $_____________________ Upload your assignment here. using python and no copy from other assingment and...

Develop an Android app to document the lifecycle of an “activity” For each callback events (onCreate(),...

Develop an Android app to document the lifecycle of an “activity” For each callback events (onCreate(), onStart()... ), record what callback event was triggered in the log(use Log.d); the message that is written to log should be defined in “strings.xml” and getResources.getString() should be used to retrieve the message. Implement onSaveInstanceState and onRestoreInstanceState – to track the number of times onSaveInstanceState is being called, in onRestoreInstanceState, print the value to the log file. Tag for “Log” statement should also be...

You have been instructed to use C++ to develop, test, document, and submit a simple program...

You have been instructed to use C++ to develop, test, document, and submit a simple program with the following specifications. The program maintains a short data base of DVDs for rent with their name, daily rental charge, genre, and a a short description . The program will welcomes the user, user will enter the name of the movie from a displayed list of all movies that are available, the user will enter the number next to the movie's name, number...

Orange Not Apple Manufacturing Corporation J has a traditional costing system in which it applies manufacturing...

Orange Not Apple Manufacturing Corporation J has a traditional costing system in which it applies manufacturing overhead to its products using a predetermined overhead rate based on direct labor-hours (DLHs). The company has two products, H16Z and P25P, about which it has provided the following data: Direct materials per unit H16Z $10.20 P25P 50.50 Direct labor per unit 8.40 25.20 Direct labor-hours per unit 0.40 1.20 Annual production (units) 30,000 10,000 The company's estimated total manufacturing overhead...

Orange, Inc. is currently a market leader in biomedical test equipment, but the firm’s future has...

Orange, Inc. is currently a market leader in biomedical test equipment, but the firm’s future has never been more uncertain, as it is contemplating two projects that fall into the “unchartered waters” category. The CEO, Tim Jobless, who also owns 50.1% of the firm’s 1 million outstanding shares, often disagrees with the rest of the shareholders. The first project under evaluation is production of the ePhone, a smartphone that is more smart than phone. Its marketing department has engaged Ripoff...

You and your hypothetical lab partner each develop an experimental plan to test this hypothesis. The...

You and your hypothetical lab partner each develop an experimental plan to test this hypothesis. The two experimental plans are presented below. Evaluate each plan for its pros and cons in the experimental design using the bullet points below. Both experimental plans have some good elements and areas that could be improved. Experiment A) Mature 2 inch sections (sprigs) of Elodea will be used to measure oxygen production under different light conditions. 5 sprigs will be tested. One will be...