Gross Profit Calculator

This site is best viewed in a modern browser with JavaScript enabled.

gooders

Hi There,

apologies if this is the wrong forum - But i'm looking at creating a Gross Profit calculator for my website, with the user basically having to enter the price for the whole case, the number of units in that case and what % gross profit they are after. The user will then press the calculate button, and it will calculate:

the selling price per unit (exc vat)
the selling price per unit (inc vat) @ 20%
the cash margin per unit

I realise that this is a bit of a begging mail, as my javascript skills are pretty limited (i.e. zilch!). So any help on this would be pretty awesome. I've got the html code for the form which i've quickly knocked up, it's just the JS problems that i have issues with.

<strong>Gross Profit Calculator</strong>
<br />
<br />
<label>
    Case price (exc VAT):
    <input data-bind="value: CasePrice"/>
</label>
<br />
<label>
    Units case :
    <input data-bind="value: UnitsCase"/>
</label>
<br />
-------------------------------------------------------------
<br />
<label>
    What % GP do you want?: 
    <input data-bind="value: percGP"/>
</label>
<br />
<label>
   Cost price per unit: 
    <output data-bind="value: costPrice"/>
</label>
<br />
-------------------------------------------------------------
<br />
<label>
    Selling price per unit (exc VAT):
    <output data-bind="value: sellPricexVAT"/>
</label>
<br />
<label>
    Selling price per unit (inc VAT):
    <output data-bind="value: sellPriceVAT"/>
</label>
<br />
<br />
<label>
    Cash margin per unit:
    <output data-bind="value: cashMargin"/>
</label>
<br />
<br />
<button type="button">Calculate GP</button>

Any help at all will be pretty awesome,

Thanks!!

JMRKER

You'll need to check the math portion as I just made up some numbers
and guessed at the relationships of the displays.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title> Untitled </title>
</head>

<body>
<strong>Gross Profit Calculator</strong> <br /> <br />
<label> Case price (exc VAT):
 <input id="CasePrice" data-bind="value: CasePrice" value="100"/> </label> <br />
<label> Units per case :
 <input id="UnitsCase" data-bind="value: UnitsCase" value="12"/> </label> <br />
-------------------------------------------------------------
<br />
<label> What % GP do you want?:
 <input id="percGP" data-bind="value: percGP" value="0.10" /> </label> <br />
<label> Cost price per unit:
 <input id="costPrice" data-bind="value: costPrice" value="" readonly /> </label><br />
------------------------------------------------------------- <br />
<label> Selling price per unit (exc VAT):
 <input id="sellPricexVAT" data-bind="value: sellPricexVAT" value="" readonly /> </label> <br />
<label> Selling price per unit (inc VAT):
 <input id="sellPriceVAT" data-bind="value: sellPriceVAT" value="" readonly /> </label> <br />
<br />
<label> Cash margin per unit:
 <input id="cashMargin" data-bind="value: cashMargin" value="" readonly /> </label> <br />

<br />
<button onclick="calcGProfit()"> Calculate GP </button>

<script type="text/javascript">
function calcGProfit() {
  var caseprice = document.getElementById('CasePrice').value * 1;
  var unitsPerCase = document.getElementById('UnitsCase').value * 1;
  var percentProfit = document.getElementById('percGP').value * 1;

  costPrice = caseprice / unitsPerCase;
  costPrice += costPrice * percentProfit;
  document.getElementById('costPrice').value = costPrice.toFixed(2);

  var sell$ = (caseprice * unitsPerCase);
  document.getElementById('sellPricexVAT').value = (sell$/unitsPerCase).toFixed(2);

  var sell$$ = sell$ + (sell$ * 0.20);
  document.getElementById('sellPriceVAT').value = (sell$$/unitsPerCase).toFixed(2);

  var Cmargin = (sell$$ - sell$) / unitsPerCase;
  document.getElementById('cashMargin').value = Cmargin.toFixed(2);
}
</script>

</body>
</html>

gooders

Thanks for that, it's along the right track of what i wanted (though like you say the maths is slightly off). I've tried to fix the maths of it, but i keep breaking it somehow

Also, i've missed out a field from the form by mistake so the form should be

<body>
<strong>Gross Profit Calculator</strong> <br /> <br />
<label> Case price (exc VAT):
 <input id="CasePrice" data-bind="value: CasePrice" value="100"/> </label> <br />
<label> Units per case :
 <input id="UnitsCase" data-bind="value: UnitsCase" value="12"/> </label> <br />
-------------------------------------------------------------
<br />
<label> What % GP do you want?:
 <input id="percGP" data-bind="value: percGP" value="0.10" /> </label> <br />
<label> Cost price per unit:
 <input id="costPrice" data-bind="value: costPrice" value="" readonly /> </label><br />
------------------------------------------------------------- <br />
    <label>Selling Price Per Case (exc VAT):
        <input id="sellPriceCase" data-bind="value: sellPriceCase" value="" readonly /></label><br />
<label> Selling price per unit (exc VAT):
 <input id="sellPricexVAT" data-bind="value: sellPricexVAT" value="" readonly /> </label> <br />
<label> Selling price per unit (inc VAT):
 <input id="sellPriceVAT" data-bind="value: sellPriceVAT" value="" readonly /> </label> <br />
<br />
<label> Cash margin per unit:
 <input id="cashMargin" data-bind="value: cashMargin" value="" readonly /> </label> <br />

<br />
<button onclick="calcGProfit()"> Calculate GP </button>

To help with the maths it should be worked out like this

Cost Price Per unit (ex VAT) - case price/units per case

Selling price per case (ex VAT) - cost price per unit/gross profit * units per case

Selling price per unit (exc VAT) - Selling price per case/units per case

Selling Price Per Unit (inc VAT) - selling price per unit (exc VAT) * 20%

Cash Margin Per Unit - Selling price per unit (minus) cost price per unit.

I realise im probably pushing my look, and i'll keep trying it myself, but if you could help with this bit that would be awesome !

Thanks for your time!

gooders

I've managed to work it out how i want too, but when i enter the % GP that i want, i have to enter the % as 0.30, rather then 30 (for example) Would someone be able to point me in the right direction - have attached the code below.

<body>
<p style="font-family:arial;color:black;font-size:20px;">
<strong>Gross Profit Calculator</strong></p>
<p style="font-family:arial;color:black;font-size:12px;">
<label> Case price (exc VAT): &#163;
 <input id="CasePrice" data-bind="value: CasePrice" value="100"/> </label> <br />
<br /><label> Units per case: &#163;
 <input id="UnitsCase" data-bind="value: UnitsCase" value="12"/> </label><br /><br />
-------------------------------------------------------------
<br />
<label> What % GP do you want?:
 <input id="percGP" data-bind="value: percGP" value="30" /> %</label>
<p style="font-family:arial;color:red;font-size:12px;">
 <label> Cost price per unit: &#163;
 <input id="costPrice" data-bind="value: costPrice" value="" readonly /> </label></p>
------------------------------------------------------------- 
<p style="font-family:arial;color:black;font-size:12px;">
<label> Selling price per case (exc VAT): &#163;
 <input id="sCase" data-bind="value: sellCase" value ="" readonly /></label><br /><br />
<label> Selling price per unit (exc VAT): &#163;
 <input id="sellPricexVAT" data-bind="value: sellPricexVAT" value="" readonly /> </label><br /><br />
<label> Selling price per unit (inc VAT): &#163;
 <input id="sellPriceVAT" data-bind="value: sellPriceVAT" value="" readonly /> </label></p>
</p>
<p style="font-family:arial;color:green;font-size:12px;">
<label> Cash margin per unit: &#163;
 <input id="cashMargin" data-bind="value: cashMargin" value="" readonly /> </label> <br /></p>

<br />
<button onclick="calcGProfit()"> Calculate GP </button>

<script type="text/javascript">
function calcGProfit() {
  var caseprice = document.getElementById('CasePrice').value * 1;
  var unitsPerCase = document.getElementById('UnitsCase').value * 1;
  var percentProfit = document.getElementById('percGP').value * 1;

  costPrice = caseprice / unitsPerCase;
  document.getElementById('costPrice').value = costPrice.toFixed(2);

  var sellCase = costPrice / (1 - percentProfit) * unitsPerCase;
  document.getElementById('sCase').value = sellCase.toFixed(2);

  var sell$ = (sellCase / unitsPerCase);
  document.getElementById('sellPricexVAT').value = sell$.toFixed(2);

  var sell$$ = sell$ * (1 + 0.20);
  document.getElementById('sellPriceVAT').value = sell$$.toFixed(2);

  var Cmargin = sell$ - costPrice;
  document.getElementById('cashMargin').value = Cmargin.toFixed(2);


}
</script>

</body>
</html>

JMRKER

One easy change...


// in the JS section
  var percentProfit = document.getElementById('percGP').value / 100;

gooders

Haha, yeah i spent an hour the other day thinking how can i do that and then went "oh yeah, divide by 100" - what a fool haha

But thanks very much folks, you've all been super helpful - i'll use this place again for sure!

JMRKER

gooders;1261573 wrote:
Haha, yeah i spent an hour the other day thinking how can i do that and then went "oh yeah, divide by 100" - what a fool haha

But thanks very much folks, you've all been super helpful - i'll use this place again for sure!

You're most welcome.
Happy to help.
Good Luck!