I'm developing the following retirement calculator in JavaScript, I'm still learning the language.
The calculator is already working normally the way it is there, but I would need to put more fields and do the calculation with them as well. If possible the user clicks on some + and more fields automatically appear. How could I do that?
Follow the Code
<form class="form-calculadora" name="aposentadoria">
<fieldset class="sexo">
<legend>Sexo</legend>
<select id="sexo" name="sexo" class="text-area">
<option value="M"><i class="fa fa-male"></i>Masculino</option>
<option value="F"><i class="fa fa-female"></i>Feminino</option>
</select>
</fieldset>
<fieldset class="trabalho">
<div class="row">
<div class="empresa-area">
<p class="title">Empresa</p>
<input type="text" name="empresa" class="text-area" placeholder="Empresa: ">
</div>
<div class="regra-area">
<p class="title">Regra</p>
<select name="regra" class="text-area">
<option value="25">25 anos</option>
<option value="20">20 anos</option>
<option value="15">15 anos</option>
</select>
</div>
<div class="admissao-area">
<p class="title">Admissão</p>
<input type="date" name="dataAdmissao" class="text-area" placeholder="Admissão: ">
</div>
<div class="demissao-area">
<p class="title">Demissão</p>
<input type="date" name="dataDemissao" class="text-area" placeholder="Demissão: ">
</div>
<div class="anos-area">
<p id="anosTrabalhados">0 Anos</p>
</div>
</div>
</fieldset>
<input type="button" value="Calcular" onclick="calcula();" >
</form>
<p id="result"><img src="./img/aviso.png"></p>
JAVASCRIPT
function calcula(){
var sexo = document.aposentadoria.sexo.value;
var nRegra = document.aposentadoria.regra.value;
var empresa = document.aposentadoria.empresa.value;
var dataAdmissao = new Date(document.aposentadoria.dataAdmissao.value);
var dataDemissao = new Date(document.aposentadoria.dataDemissao.value);
if (dataDemissao > dataAdmissao) {;
var anosTrab = dataDemissao.getFullYear() - dataAdmissao.getFullYear();
var dateTrab = dataDemissao.getDate() - dataAdmissao.getDate();
var mesTrab = dataDemissao.getMonth() - dataAdmissao.getMonth();
} else {
alert("A data de admissão deve ser anterior à data de demissão.");
}
if ((sexo == "M") && (nRegra == "25")) {
anosNovo = anosTrab * 1.40;
} else if ((sexo == "M") && (nRegra == "20")) {
anosNovo = anosTrab * 1.75;
} else if ((sexo == "M") && (nRegra == "15")) {
anosNovo = anosTrab * 2.33;
} else if ((sexo == "F") && (nRegra == "25")) {
anosNovo = anosTrab * 1.20;
} else if ((sexo == "F") && (nRegra == "20")) {
anosNovo = anosTrab * 1.50;
} else if ((sexo == "F") && (nRegra == "15")) {
anosNovo = anosTrab * 2;
}
if (sexo == "M") {
anosFalta = anosNovo - 35;
} else if (sexo == "F") {
anosFalta = anosNovo - 30;
}
if (anosFalta < 0) {
anosFim = anosFalta * -1;
}
var anosAjus = "Você trabalhou " +anosTrab+ " anos " +mesTrab+ " meses e " +dateTrab+ " dias";
var calculoNovaR = "Faltam " +anosFim+ " anos para se aposentar";
document.getElementById("anosTrabalhados").innerHTML = anosTrab+ " anos";
document.getElementById("result").innerHTML = "<img src='./img/aviso.png'>" +anosAjus+ "<br />" +calculoNovaR;}