Beginner Help Please

I will start off by saying yes this is homework but I only want help. I'm trying to make the content show up in the read only boxes but I can't figure out where I'm going wrong. My test page can be found at http://sidewalk-cafe.com/test/maddox-hw2a.html. It's small. Any help would be appreciated.

function orderForm() {
var formDaysStaying = document.getElementById("daysStaying").value;
var formSeason = document.getElementById("season").value;
var formPropertyType = document.getElementById("propertyType").value;
document.getElementById("FEE").value = "$" + today.toFixed(2);
document.getElementById("totalCost").value = "$" + today.toFixed(2);
document.getElementById("today").value = "$" + today.toFixed(2);
document.getElementById("due").value = "$" + due.toFixed(2);
}


function formTotalCost(form) {
const FEE = 55;
var totalCost = (formPropertyType * formSeason) * formDaysStaying;
var today = totalCost * .10;
var due = (totalCost + FEE) - today;
if (document.getElementById("daysStaying").value == "" ||
isNaN(document.getElementById("daysStaying").value))
alert("Please provide the number of days you will be staying.");
// Submit the order to the server
form.submit();
}

Your problem is that all those variables that you declared using the var keyword in your first function are *INVISIBLE* to any other function.

They are called "local variables".

If you want a "global variable" (one visible to all functions) you *can* just omit the var keyword, but it's much better practice to declare them outside of any funciton.

So, for example:


var formDaysStaying;
var formSeason;
var formPropertyType;

function orderForm() {
formDaysStaying = document.getElementById("daysStaying").value;
formSeason = document.getElementById("season").value;
formPropertyType = document.getElementById("propertyType").value;
document.getElementById("FEE").value = "$" + today.toFixed(2);
document.getElementById("totalCost").value = "$" + today.toFixed(2);
document.getElementById("today").value = "$" + today.toFixed(2);
document.getElementById("due").value = "$" + due.toFixed(2);
}
...


What happens, though, if your second function gets called before the first one ever is invoked??

I think, as a safety measure, you might want to call the first function as the very first action in the second one.

Also... You have an alert there in the second function, but even though you tell the user something is wrong, you go ahead and submit the <form>.

Finally, if you are calling your second function from either the <form onsubmit=...> or any <input type=submit onclick=...>, you have a problem.

****

Oh, and also: It's a really bad idea to have an if that is *NOT* followed by { ... } to clearly denote what statements are going to be executed (or not) because of the if.

Thank you!! I helps a lot and it finally clicks a little more. I shall now stare at my screen some more.

Just one more thing: Where the heck is the today variable coming from? I think all those usages of + today.toFixed(2) have a problem???

Soooo apparently I'm still an idiot cause this still isn't clicking for me. Please help again. :)

http://www.sidewalk-cafe.com/test/maddox-hw2a.html