Function to call other and popular inputs

Question

Function to call other and popular inputs

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

In my view I have several functions in which in my current logic, they work like this: I fill in the data previously and I have 4 buttons that I click on and they are doing some accounts.

What happens is that I wanted to be able to call all the functions at once and do the right calculations, but at the click of a button ...

My codes are:

 <div class="form-group">
                @Html.LabelFor(model => model.AccSuprailiaca, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccSuprailiaca, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccSuprailiaca, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccTriciptal, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccTriciptal, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccTriciptal, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccSubescaputar, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccSubescaputar, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccSubescaputar, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccAbdominal, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccAbdominal, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccAbdominal, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccCoxa, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccCoxa, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccCoxa, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccPanturilha, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccPanturilha, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccPanturilha, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccPeitoral, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccPeitoral, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccPeitoral, "", new { @class = "text-danger" })
                </div>
            </div>

First of all, I fill in the text boxes with the data, this one over there ... And then I use them to do the following calculations:

<div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="button" onclick="calcula_percentualGordura();" value="Calcular" class="btn btn-default" />
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccPercentualGordura, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccPercentualGordura, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccPercentualGordura, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="button" onclick="calcula_percentualMassaMagra();" value="Calcular" class="btn btn-default" />
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccMassaMagra, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccMassaMagra, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccMassaMagra, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="button" onclick="calcula_gordura();" value="Calcular" class="btn btn-default" />
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccPrcentualGorduraQuilos, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccPrcentualGorduraQuilos, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccPrcentualGorduraQuilos, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="button" onclick="calcula_massaMagra();" value="Calcular" class="btn btn-default" />
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.AccMassaMagraQuilos, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.AccMassaMagraQuilos, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.AccMassaMagraQuilos, "", new { @class = "text-danger" })
                </div>
            </div>

Here I can only popular the data after completing the data previously and to fill in the above fields, notice, I need to click on 4 different buttons ...

Would there be a way to create a function that would span all functions called on the 4 buttons at once, I mean, on a button?

My roles:

  function calcula_percentualGordura() {

        //pegando os valores dos campos
        var sexo = document.getElementById("AccSexo");
        var sexoValor = sexo.value;

        var idade = document.getElementById("AccIdade");
        var idadeValor = idade.value;

        var percentualGordura = document.getElementById("AccPercentualGordura");
        var percentualGorduraValor = percentualGordura.value;

        var suprailiaca = document.getElementById("AccSuprailiaca");
        var suprailiacaValor = suprailiaca.value;

        var triciptal = document.getElementById("AccTriciptal");
        var triciptalValor = triciptal.value;

        var subEscapular = document.getElementById("AccSubescaputar");
        var subEscapularValor = subEscapular.value;

        var abdominal = document.getElementById("AccAbdominal");
        var abdominalValor = abdominal.value;

        var coxa = document.getElementById("AccCoxa");
        var coxaValor = coxa.value;

        var panturilha = document.getElementById("AccPanturilha");
        var panturilhaValor = panturilha.value;

        var peitoral = document.getElementById("AccPeitoral");
        var peitoralValor = peitoral.value;

        var equacao;

        var totalCampos = Number(suprailiacaValor) + Number(triciptalValor) + Number(subEscapularValor) +
                          Number(abdominalValor) +
                          Number(coxaValor) + Number(panturilhaValor) + Number(peitoralValor);

        var quadrado = totalCampos * totalCampos;

        if(sexoValor == "Masculino"){
            equacao = Number(1.112) - Number(0.00043499) * (totalCampos) +
                                            Number(0.00000055) *
                                            (quadrado) -
                                            (Number(0.0002882) * Number(idadeValor))
        } else {
            if (sexoValor == "Feminino") {
                equacao = Number(1.097) - Number(0.00046971) * (totalCampos) +
                                           Number(0.00000056) *
                                           (quadrado) -
                                           (Number(0.00012828) * Number(idadeValor))
            }
        }

        var percentual = Number((4.95 / equacao) - Number(4.5)) * 100;

        percentualGordura.value = percentual.toFixed(2);

    }

    function calcula_percentualMassaMagra() {

        var massaMagra = document.getElementById("AccMassaMagra");
        var massaMagraValor = massaMagra.value;

        var percentualGordura = document.getElementById("AccPercentualGordura");
        var percentualGorduraValor = percentualGordura.value;

        var massaMagraConta = Number(100) - Number(percentualGorduraValor);

        massaMagra.value = massaMagraConta.toFixed(2);
    }

    function calcula_gordura() {

        var peso = document.getElementById("AccPeso");
        var pesoValor = peso.value;

        var percentualGordura = document.getElementById("AccPercentualGordura");
        var percentualGorduraValor = percentualGordura.value;

        var percentualGorduraQuilos = document.getElementById("AccPrcentualGorduraQuilos");
        var percentualGorduraQuilosValor = percentualGorduraQuilos.value;

        var pesoquilosConta = Number(pesoValor) * Number(percentualGorduraValor) / 100;

        percentualGorduraQuilos.value = pesoquilosConta.toFixed(2);
    }

    function calcula_massaMagra() {

        var peso = document.getElementById("AccPeso");
        var pesoValor = peso.value;

        var massaMagra = document.getElementById("AccMassaMagra");
        var massaMagraValor = massaMagra.value;

        var massaMagraQuilos = document.getElementById("AccMassaMagraQuilos");
        var massaMagraQuilosValor = massaMagraQuilos.value;

        var massaMagraQuilosConta = Number(pesoValor) * Number(massaMagraValor) / 100;

        massaMagraQuilos.value = massaMagraQuilosConta.toFixed(2);
    }

javascript asp.net-mvc

asked by anonymous 23.06.2016 / 06:16

2 answers

0

In the click event of the button you can place a function calculates () and inside it only the call of the other functions that you did. Something like this:

$( "button" ).click(function() {
  calcula_massaMagra();
  calcula_gordura();
});

23.06.2016 / 08:48

Change background color Error catching Foreach data and sending to PHPMailer

score 0 · Accepted Answer

Using only javascript you can create a function to call all the others, as you are already doing.

 function calcula_tudo() {
      calcula_percentualGordura()
      calcula_massaMagra();
      calcula_gordura();
      calcula_percentualMassaMagra()  
    }

And in your button you call this function in onclick() .

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="button" onclick="calcula_tudo();" value="Calcular" class="btn btn-default" />
                </div>
            </div>

It's worth mentioning that you're doing four different calculations, so it's best to have four functions like you already did. If you're using jquery , you can use the @user5988 that will work normally.