Basic Tutorial Three (variable controlled for/next loop, printing in columns and rounding)

In this tutorial you will once again modify the Rental Car program. As in the earlier programs, you will have the user enter the four data items for each car, and as before, the program will calculate the total miles driven and the miles per gallon and display that data in a short report on the screen.
This time your program will allow the user to enter data for as many rentals as needed instead of a fixed number (such as 3 rentals in the previous tutorial.) When the program first starts up, it will ask the user to enter the number of car rentals to be processed during the run. It will use the VBasic for/next loop to run through the input, process and output steps for each car until all of the rentals have been processed.
This tutorial also introduces the use of the Display Table Row Statements to allow for printing date in columns under specific column headings within a table.
As in Tutorial Two, at the end of the report table, after all of the rentals have been listed, your program will print summary information including the number of rentals processed and the average mileage obtained by all vehicles reported. This tutorial also introduces the round() function to round the resultant average miles per gallon to the nearest tenth (i.e. 32.3 rather than 32.3333).
Follow the steps outlined below to create and run this VBasic application.
Note: the BASIC Reference Guide can be download from this link. It identifies the VBasic instructions you will use coding in these four programs.

STEP 1 - Setting Up Your Browser and Notepad:

  • Download the BasicTutorialThree.html file onto your student data disk
  • Right-click the link
  • Choose "Save Target As"
  • Open the document in Notepad to see the code that has been entered for you along with additional comment (rem) statements that indicate the different parts of the program.

STEP 2 - Enter Code Statements using Notepad:

  • As before, change the first comment statement to show that you are the author of the program.
You will need the same variables you used in the previous program (i.e. carType, startMiles, endMiles, gallonsUsed, totalMiles, milesPerGallon, carMessage, carIndex, mpgAccumulator and averageMPG), which already have been coded for you. You will also need to add a new variable (carsRented) which will be used as the End Value for determining when to end the for/next loop.

After the existing variable declarations, enter the additional statement:
dim carsRented
The report title and a following blank line appear next. Don't forget to change the student name. The last statement in the Print report title section instructs the program to initiate the table. It has already been coded for you.
  • In the Print column headings section you will enter the statements to create column headings as the first row of the report table.
  • The following four statements will establish a single row with four column headings:
document.write("<tr>")
document.write("<td>" & "Make of Car")
document.write("<td>" & "Miles Driven")
document.write("<td>" & "Miles per Gallon")
document.write("<td>" & "Economy Rental")

  • Following the comment statement that indicates where you must request the number of cars from the user, enter the following assign input statement to assign the carsRented variable an integer value:
carsRented = cint(inputbox("Enter number of cars rented."))

The for/next statement, coded to control the number of times the program will loop, will need to be modified to use the carsRented variable for the end-value instead of "3".
  • Modify the existing for statement:
for carIndex = 1 to carsRented

The code for getting the starting and ending odometer readings and the number of gallons used remains the same, as does the code for calculating the total miles driven, the car's mileage and the service message. These statements are already entered.


Next inside the loop comes the code for printing the detail lines, this time with each data item listed in its own column (see column headings above.)
document.write("<tr>")
document.write("<td>" & carType)
document.write("<td>" & totalMiles)
document.write("<td>" & milesPerGallon)
document.write("<td>" & carMessage)

Printing the detail lines is teh last task your program needs to perform within the for/next loop.
  • The for/next loop return section of your program marks the end of the loop. It is also the end of the report table and requires the following code to close the table. It is to be written immediately after the next statement:
document.write("</table>")
You're almost done! You only need to modify the lines of code that calculate the average mileage of the rentals and produce the report summary. Since the number of rentals for any particular run of the program is contained in the carsRented variable, modify the Summary Report code to use carsRented instead of the number "3".

Also, you will apply the round() function to round the average miles per gallon to the nearest 10th.
averageMPG = round( mpgAccumulator / carsRented,1)
document.write("Report Summary:  ")
document.write(carsRented)
document.write(" cars were processed with an average mileage value of  ")
document.write(averageMPG & ".")

Congrats!! You are done making modifications.

  • Go back and carefully check your typing
  • Click the 'Save' icon to save your changes

STEP 3 - Time to Test:

Test your program in your browser
  • When asked to enter data, use the following four cars to test your program:
Chevy with a starting odometer reading of 2300, an ending reading of 2742 and 8.5 gallons used.
Ford with a starting odomenter reading of 16507, an ending reading of 17200 and 46.2 gallons used
Dodge with a starting odometer reading of 14000, an ending reading of 14300 and 10 gallons used
Jeep with a starting odometer reading of 200, an ending reading of 600 and 32 gallons used
Once you have entered the last requested data, and if you have coded your program correctly, your program will produce the written report on the monitor and end.

Be sure to verify the results with the image at the top of this tutorial.

STEP 4 - Documentation:

  • Print a copy of the page displayed on your browser and a copy of the source code from Notepad for your future reference
Return to 110 Examples Page