Member Avatar for basamdamdu

Hi there,

I am trying to come up with an instant price quote calculator in javascript.

it would be a simple one with only three fields:
"label" -Number of Shirts
"label" -Number of Colors on Front
"label" -Number of Colors on Back

"button" calculate total

"results" total: $xx per bag:$xx

total price would decrease based on the number of shirts (more volume) / increase based on the number of colors both front and back.

something i found online that is 100% what i want: http://zeustees.com/about-us

i am not too familiar with javascript. ok tinkering with jquery but that's it.

i am obviously not asking anyone to work for free but if someone could point me to a semblance of a solution, some code, something online that i could modify etc. i would love to learn javascript in the process and ideally come up with a working version of the calculator.

i tried to work with the .js from that website but it calls in some qq2.php page. so i haven't been able to replicate the solution. plus, i would assume that their price structure would be different than mine.

thank you in advance for your help
BD

  • 6 Contributors
  • 7 Replies
  • 2K Views
  • 1 Year Discussion Span
  • Latest Post Latest Post by etshirt
Member Avatar for katarey

Hi,

I hope this code may help you to get the solution you want

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Calc</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
<!-- 
$(document).ready(function() {
	$('#calculateTotal').click(function() {
		
			var shirtsPrice = 10.50, perColorPrice = 5.99;	
			
			var inputNum_of_Shirts = $('#shirts').val();
			var inputNum_of_FColor = $('#colorsOnFront').val();
			var inputNum_of_BColor = $('#colorsOnBack').val();
			
			var totalCost = (inputNum_of_Shirts*parseFloat(shirtsPrice))
			+(parseFloat(perColorPrice)*inputNum_of_FColor)
			+(parseFloat(perColorPrice)* inputNum_of_BColor );
			var perShirtCost = (parseFloat(shirtsPrice))
			+(parseFloat(perColorPrice)*inputNum_of_FColor)
			+(parseFloat(perColorPrice)*inputNum_of_BColor);
			
			$('#total').html(formatCurrency(totalCost));
			$('#perShirt').html(formatCurrency(perShirtCost));
			$('#result').css('display', 'block');
	});
});
// This Function I have searched from Web 
function formatCurrency(strValue)
{
	strValue = strValue.toString().replace(/\$|\,/g,'');
	dblValue = parseFloat(strValue);

	blnSign = (dblValue == (dblValue = Math.abs(dblValue)));
	dblValue = Math.floor(dblValue*100+0.50000000001);
	intCents = dblValue%100;
	strCents = intCents.toString();
	dblValue = Math.floor(dblValue/100).toString();
	if(intCents<10)
		strCents = "0" + strCents;
	for (var i = 0; i < Math.floor((dblValue.length-(1+i))/3); i++)
		dblValue = dblValue.substring(0,dblValue.length-(4*i+3))+','+
		dblValue.substring(dblValue.length-(4*i+3));
	return (((blnSign)?'':'-') + '$' + dblValue + '.' + strCents);
}

-->
</script>
</head>
<body>
<form id="calc" name="calc">
  	<p>
      <input id="shirts" name="shirts" type="text">
      <label for="shirts">Number of Shirts</label>
    </p>
    <p>
      <input id="colorsOnFront" name="colorsOnFront" type="text">
      <label for="colorsOnFront">Number of Colors on Front</label>
    </p>
    <p>
      <input id="colorsOnBack" name="colorsOnBack" type="text">
      <label for="colorsOnBack">Number of Colors on Back</label>
    </p>
    <p><input name="calculateTotal" id="calculateTotal" type="button" value="Calculate Total" /></p>
    <div id="result" style="display:none;"><strong>Total:</strong> <span id="total"></span> <strong>Per Shirt:</strong> <span id="perShirt"></span></div>
  </div>
</form>
</body>
</html>

Rahul Dev Katarey

Member Avatar for basamdamdu

wow!! thanks a million Katarey!!

this is wonderful and is sure going to help me a bunch. and with the way it's written, i can actually understand the code and try to experiment with it (i'm now gonna try to add the increase/decrease volume price thing and maybe a constant, like set up cost etc)... well, let's start with the constant thing :)

i'll post the whole thing once done.
thanks again for your help. it is greatly appreciated!
BD

Member Avatar for degasdad

basamdamdu

Did you ever figure out how to add the volume pricing to this formula???? If so could you please post it

Edited by degasdad because: n/a
Member Avatar for Taywin

@degasdad
Isn't line 14 reading the value of shirt volume? Also, line 18-20 are the computation including the volume of the price already?

By the way, in the computation of line 18-23, I believe that you do not need 'parseFloat()' because the variables are already declared as 'float' inside the function. They are not string in the first place.

Also, the formatCurrency() accepts string which may contains currency string in it, but the call actually passes a float value to it. Therefore, there are unnecessary steps in the function for this case - attempt to remove '$' or ',' & convert the string back to float (line 33 & 34).

Edited by Taywin because: n/a
Member Avatar for basamdamdu

Hi degasdad,
sorry for the late reply.
no i haven't because the project has been canceled :(
thank you katarey for your help.
BD

Member Avatar for bojinggai

hi- I want to use this calculator in website but I am trying to sell services not products. What if I add a base fee or a flat fee in each of the item? Thank you so much! -Jessy

Member Avatar for etshirt

I need to add a drop down list with differents style of t-shirt can anyone help me. I will try to make this code work to calculate quotes on my website.

Thank you

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.