How to Create GST Calculator using Javascript or Jquery?

“Create GST Tax Calculator in Javascript, How to calculate GST using JavaScript Code, Create Auto Calculate GST in Javascrip or Jquery, Calculate GST Function using Javascript”

Today I will tell you how you can gst calculate by javascript code. The full form of GST is Goods and Services Tax.

Today I will tell you how to create a gst calculator by javascript code. First of all, you create an html form, add 3 text field and 1 button. For this you can see in the example mentioned below.

<html>
<head>
<title>How to Create GST Calculator using Javascript</title>
</head>
<body>
<div>
<label for="price">Price (before GST): </label>
<input id="price" type="number" value="1" />
</div>
<div>
<label for="gst">GST rate (%): </label>
<input id="gst" type="number" value="0.6" />
</div>
<div>
<button onclick="inpChange()">Calculate</button>
</div>
<div>
<label for="priceGst">Price (GST inclusive) : </label>
<input id="priceGst" type="number" readonly />
</div>
</body>
</html>

Then after that you write script code for gst calculation, for example you can see the script code given below.

<script>
priceEle = document.getElementById("price");
gstEle = document.getElementById("gst");
priceGstEle = document.getElementById("priceGst");
function calculateGst(price, tax) {
return (price * tax/100) + price;
} 
function inpChange() {
if(!isNaN(priceEle.value) && !isNaN(gstEle.value)) {
price = Number(priceEle.value);
gst = Number(gstEle.value);
priceGstEle.value = calculateGst(price, gst).toFixed(3);
}
}
inpChange();
</script>

You can add whole code to gst-calculator.html by creating a file.

gst-calculator.html

<html>
<head>
<title>How to Create GST Calculator using Javascript</title>
</head>
<body>
<div>
<label for="price">Price (before GST): </label>
<input id="price" type="number" value="1" />
</div>
<div>
<label for="gst">GST rate (%): </label>
<input id="gst" type="number" value="0.6" />
</div>
<div>
<button onclick="inpChange()">Calculate</button>
</div>
<div>
<label for="priceGst">Price (GST inclusive) : </label>
<input id="priceGst" type="number" readonly />
</div>
<script>
priceEle = document.getElementById("price");
gstEle = document.getElementById("gst");
priceGstEle = document.getElementById("priceGst");
function calculateGst(price, tax) {
return (price * tax/100) + price;
} 
function inpChange() {
if(!isNaN(priceEle.value) && !isNaN(gstEle.value)) {
price = Number(priceEle.value);
gst = Number(gstEle.value);
priceGstEle.value = calculateGst(price, gst).toFixed(3);
}
}
inpChange();
</script>
</body>
</html>