XF 1.2 Add symbol to javascript output?

[Dynamic]

Hi guys,

I guess this is not really related to Xenforo but I am using it in my pages.

I have made a simple calculator to estimate electricity bills. Now, there is a button that says "Calculate" and when it is clicked it displays the cost, eg ( 5.00 ) which is $5. What I am having trouble doing is getting the $ symbol in front of the number. Here is the code.

<input type="button" name="calculate" id="area" size="4" onclick="calculateArea();" value="Calculate Daily Cost" class="checkout-btn">

The onclick is what I would like to add the symbol to (in front of the calculateArea()

Thanks.

 

[Jeremy]

Do you have access to the JavaScript?

 

[Dynamic]

Yeah

Here it is.

function calculateArea() {
  var primarylights =+document.getElementById("primarylights").value;
  var primarylightshours =+document.getElementById("primarylightshours").value;
  var secondarylights =+document.getElementById("secondarylights").value;
  var secondarylightshours =+document.getElementById("secondarylightshours").value;
  var powerheads =+document.getElementById("powerheads").value;
  var powerheadshours =+document.getElementById("powerheadshours").value;
  var primarypumps =+document.getElementById("primarypumps").value;
  var primarypumpshours =+document.getElementById("primarypumpshours").value;
  var secondarypumps =+document.getElementById("secondarypumps").value;
  var secondarypumpshours =+document.getElementById("secondarypumpshours").value;
  var returnpump =+document.getElementById("returnpump").value;
  var returnpumphours =+document.getElementById("returnpumphours").value;
  var heater =+document.getElementById("heater").value;
  var heaterhours =+document.getElementById("heaterhours").value;
  var chiller =+document.getElementById("chiller").value;
  var chillerhours =+document.getElementById("chillerhours").value;
  var misc =+document.getElementById("misc").value;
  var mischours =+document.getElementById("mischours").value;
  var cost =+document.getElementById("cost").value;
  var area = ((( primarylights * primarylightshours ) + ( secondarylights * secondarylightshours ) + ( powerheads * powerheadshours ) + ( primarypumps * primarypumpshours ) + ( secondarypumps * secondarypumpshours ) + ( returnpump * returnpumphours ) + ( heater * heaterhours ) + ( chiller * chillerhours ) + ( misc * mischours )) * cost)  / 1000;
  document.getElementById("area").value = area;

}

 

[Jeremy]

Set the element to be '$' + area.

 

[Dynamic]

Hey @Jeremy

Thanks for that. It does not work ( I don't think I did it right ). I have

document.getElementById("'$' + area").value = area;

It does not display anything when the calculation is made.

 

[Jeremy]

document.getElementById("area").value = '$' + area;

 

[Dynamic]

Thanks @Jeremy!

It worked. Thanks very much