JSFiddle - React, Tailwind, and code Playground

by amandapipare

HTML

<form>
<p>Enter Brutto Salary:</p>
<input type="number" id="brutto_monthly_salary" name="brutto_monthly_salary" class="form-control "
                        aria-label="LS_BruttoSalary" value="" min="0" required="">

<button id="submit" type="submit" class="btn btn-primary" onclick="myMonthNet()">Calculate!</button>

</form>

<p>Net Salary:</p>
<input type="number" id="net_monthly_salary" name="net_monthly_salary" class=""
                    aria-label="" value="" min="0">

JavaScript

var bruttoSalary = document.getElementById("brutto_monthly_salary").value;
var button = document.querySelector('#submit');


function usersSocialTax() {
    const sociaContributionRate = 0.0105;
    var socialTaxCalculation = bruttoSalary * sociaContributionRate;
    return socialTaxCalculation;

}

function myMonthNet() {
		/* event.preventDefault(); */
    var netSalary = bruttoSalary - usersSocialTax();
    document.getElementById("net_monthly_salary").value = netSalary.toFixed(2);
    return netSalary;
}

button.addEventListener('click', myMonthNet);

console.log(myMonthNet())