Reputation: 9855
Im trying to recreate this page http://psdtowp.com/order-now but for another purpose, Im very new to JS so what I was going to do was have a list of variables with undefined values, I then wanted to have my input fields which onkeyup would populate the variables with a value, would this be possible?
My code at the moment is...
/////////////////////////////////////////////////////////////////////
// Variables
// Content/SLA
var ContentMinutes = '';
var ContentMinutesSelector; // Switch Case
var ServiceLevel = '';
var NoOfFrames = '';
// Render Time (Hairier the Better)
var AvgFrameRenderTime = '';
var AvgFrameRenderTimeSelector; // Switch Case
var CoresInTest = '';
// Cost Estimate
var CostEstimate = '';
// Other
var EstimatedCoreHours = '';
/////////////////////////////////////////////////////////////////////
// Functions
function CalculateEstimate() {
var EstimatedTotal = EstimatedCoreHours * ServiceLevel;
document.getElementById("PriceEstimate").innerHTML=EstimatedTotal.toFixed(2);
}
I have the onkeyup Calculate in my source only this JS isn't working...
/////////////////////////////////////////////////////////////////////
// Variables
// Content/SLA
var ContentMinutes = '';
var ContentMinutesSelector; // Switch Case
var ServiceLevel = 5;
var NoOfFrames = '';
// Render Time (Hairier the Better)
var AvgFrameRenderTime = '';
var AvgFrameRenderTimeSelector; // Switch Case
var CoresInTest = '';
// Cost Estimate
var CostEstimate = ServiceLevel * EstimatedCoreHours;
// Other
var EstimatedCoreHours = 10;
/////////////////////////////////////////////////////////////////////
// Functions
function CalculateEstimate() {
document.getElementById("PriceEstimate").innerHTML=CostEstimate.toFixed(2);
}
Is now returning NaN
NVM, it seems my variables need to be set before the multiplication, I didnt realise JS read it line by line...
Upvotes: 1
Views: 2184
Reputation: 29170
you just need to add onkeyup="CalculateEstimate();"
to your inputs... like...
<input type='text' name='box1' onkeyup='CalculateEstimate();' />
Here is an example with just two boxes being added together.
Upvotes: 1