CODEWITHSUNDEEP
javascript
Liam
Liam

Reputation: 9855

Price Calculator using Javascript

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

Answers (1)

Dutchie432
Dutchie432

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

Related Questions