plan selector showing value at other imput

Asked

Viewed 72 times

0

//função exibe data de hoje no campo cancelamento

    var dia, mes,ano;

    function Data(){
        data = new Date();
        dia = data.getDate();
        mes = data.getMonth()+1;
        ano = data.getFullYear();
            if (dia <10){
          dia ='0'+dia;
        }
        if (mes <10){
          mes ='0'+mes; 
        }
        dataCompleta = ano+'-'+mes+'-'+dia;

        return dataCompleta;
    }

    window.onload = function(){
        //formato para calculo
        document.getElementById("cancelamento").value = Data();
        //formato para visualização
        document.getElementById("visualiza").value = dia+'/'+mes+'/'+ano;; 
    }

/*função calcula a data com base nos inputs adesão e cancelamento e deve retornar a diverença entre eles em meses*/
    function calculaData(){
        var adesao = new Date (document.retencao.adesao.value);
        var cancelamento = new Date (document.retencao.cancelamento.value);

        var timeDiff = Math.abs(cancelamento.getTime() - adesao.getTime());
        //retorno em dias
        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24 * 30)); 
       	document.getElementById("tempo").value = diffDays;
    }

/*função calcula a data com base nos inputs adesão e cancelamento e deve retornar a diverença entre eles em meses*/
    function calculaData(){
        var adesao = new Date (document.retencao.adesao.value);
        var cancelamento = new Date (document.retencao.cancelamento.value);

        var timeDiff = Math.abs(cancelamento.getTime() - adesao.getTime());
        //retorno em dias
        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24 * 30)); 
       document.getElementById("tempo").value = diffDays;
     }
     //Transferir valor do campo plano para o campo individual
$('#seletor').change(function() {
var valor = $('#seletor').val();
$('#individual').val(valor);
});

        function calculaParcela(){
       var individual = parseFloat(document.retencao.individual.value);
		   var dependente = parseFloat(document.retencao.dependente.value);
       var parcela = individual * dependente;
       document.getElementById("parcela").value = parcela.toFixed(2) ; 
       }
       
       function calculaInvestimento(){
			  var vparcela = parseFloat(document.retencao.parcela.value);
			  
			  var tempo = parseFloat(document.getElementById("tempo").value);
			  
			  var investimento = vparcela * tempo;
			  document.getElementById("investimento").value = investimento.toFixed(2) ;           
       }
 
<!DOCTYPE html>
<html>
  <head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title> Retenção </title>
<script language="javascript" src="javascript/funcoes.js"> 	</script>
<!-- Importar biblioteca jQuery (biblioteca JavaScript) -->
	 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
</head>
  <body>
<form name="retencao">
<fieldset>
<legend >Calculo de Investimento</legend>
<label>Adesão</label>
<input type="date" id="adesao" name="adesao" required="required" onchange="calculaData()">  
<!--pega a data de adesão do beneficiario-->    
<label>Cancelamento</label>
<!--data do cancelamento simples visualizaçao-->
<input style="display:none" type="text" id="cancelamento" name="cancelamento" onload="calculaData()">
<!--data de cancelamento do beneficiario pega a data atual-->
<input type="text" id="visualiza" name="visualiza" readonly="readonly" size="8">
<label>Planos</label>
<select id="seletor" required="required" name="seletor" onchange="calculaParcela()">
<!--Para o seletor de planos pensei em um imput select, com a seleção do plano por esse imput preciso 
que o valor seja retornado no imput individual-->
<option selected="selected" value="">Selecione o plano</option>
<option value="29.90">Fundamental</option>  
<option value="36.90">Vital</option>
</select>
<label>Dependentes</label>
<!--Aqui sera informado a quantidade de beneficiarios para calculo no valor da  parcela-->
<input type="number" value="1" min="1" max="10" id="depedente" name="dependente" required="required" onchange="calculaParcela()">
<br>        
<label>Tempo de plano</label>
<!--Este imput deve receber o resultado de uma conta dos campos adesão e cancelamento da seguinte
forma =cancelmamento - adesão e retornar a quantidade de meses que o beneficiario permaneceu com o 
plano -->
<input type="text" name="tempo" id="tempo" size="10"readonly="readonly" >
<label>Individual</label>
<!--Recebe valor artibuido ao select com o valor do plano-->
<input type="text" id="individual" name="individual" size="10">    
<label>Parcela</label>
<!--Parcela recebe a quantidade de dependentes vezes o valor individual-->
<input type="text" name="parcela" id="parcela" size="10" readonly="readonly" >
<label>Investimento</label>
<!--Investimento deve mutiplicar a quantidade de meses vezes o valor da parcela para retorno do valor
investido durante o tempo que o beneficiario permaneceu com o plano-->
<input type="text" name="investimento" id="investimento" readonly="readonly" size="10">
<br>
<input type="button" value="calcular" onclick="calculaInvestimento()">      
</fieldset>     
</form>
</body>
</html>

I wonder if it is possible to make a plan selector with the id=selector field so that it transfers the value of the plan to the Individual field whenever it is changed so far the program is almost at the end thanks to the contribution of many of you more gave a searched on the internet and found nothing similar to what I want to do someone has some idea

1 answer

0


That’s what you wanted to do?

//função exibe data de hoje no campo cancelamento

        var dia, mes,ano;

        function Data(){
            data = new Date();
            dia = data.getDate();
            mes = data.getMonth()+1;
            ano = data.getFullYear();
                if (dia <10){
              dia ='0'+dia;
            }
            if (mes <10){
              mes ='0'+mes; 
            }
            dataCompleta = ano+'-'+mes+'-'+dia;

            return dataCompleta;
        }

        window.onload = function(){
            //formato para calculo
            document.getElementById("cancelamento").value = Data();
            //formato para visualização
            document.getElementById("visualiza").value = dia+'/'+mes+'/'+ano;; 
        }

    /*função calcula a data com base nos inputs adesão e cancelamento e deve retornar a diverença entre eles em meses*/
        function calculaData(){
            var adesao = new Date (document.retencao.adesao.value);
            var cancelamento = new Date (document.retencao.cancelamento.value);

            var timeDiff = Math.abs(cancelamento.getTime() - adesao.getTime());
            //retorno em dias
            var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24 * 30)); 
           	document.getElementById("tempo").value = diffDays;
        }

    /*função calcula a data com base nos inputs adesão e cancelamento e deve retornar a diverença entre eles em meses*/
        function calculaData(){
            var adesao = new Date (document.retencao.adesao.value);
            var cancelamento = new Date (document.retencao.cancelamento.value);

            var timeDiff = Math.abs(cancelamento.getTime() - adesao.getTime());
            //retorno em dias
            var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24 * 30)); 
           document.getElementById("tempo").value = diffDays;
         }
            function calculaParcela(){
           var individual = parseFloat(document.retencao.individual.value);
           var dependente = parseFloat(document.retencao.dependente.value);
           var parcela = individual * dependente;
           document.getElementById("parcela").value = parcela.toFixed(2) ; 
           }
           
           function calculaInvestimento(){
			  var vparcela = parseFloat(document.retencao.parcela.value);
			  
			  var tempo = parseFloat(document.getElementById("tempo").value);
			  
			  var investimento = vparcela * tempo;
			  document.getElementById("investimento").value = investimento.toFixed(2) ;           
           }
     
//Transferir valor do campo plano para o campo individual
$('#seletor').change(function() {
    var valor = $('#seletor').val();
    $('#individual').val(valor);
});
<!-- Importar biblioteca jQuery (biblioteca JavaScript) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type">
    <title> Retenção </title>
    <script language="javascript" src="javascript/funcoes.js"> 	</script> 
</head>
  <body>
<form name="retencao">
    <fieldset>
    <legend >Calculo de Investimento</legend>
    <label>Adesão</label>
    <input type="date" id="adesao" name="adesao" required="required" onchange="calculaData()">  
    <!--pega a data de adesão do beneficiario-->    
    <label>Cancelamento</label>
    <!--data do cancelamento simples visualizaçao-->
    <input style="display:none" type="text" id="cancelamento" name="cancelamento" onload="calculaData()">
    <!--data de cancelamento do beneficiario pega a data atual-->
    <input type="text" id="visualiza" name="visualiza" readonly="readonly" size="8">
    <label>Planos</label>
    <select id="seletor" required="required" name="seletor">
    <!--Para o seletor de planos pensei em um imput select, com a seleção do plano por esse imput preciso 
    que o valor seja retornado no imput individual-->
    <option selected="selected" value="">Selecione o plano</option>
    <option value="29.90">Fundamental</option>      
    </select>
    <label>Dependentes</label>
    <!--Aqui sera informado a quantidade de beneficiarios para calculo no valor da  parcela-->
    <input type="number" value="1" min="1" max="10" id="depedente" name="dependente" required="required" onchange="calculaParcela()">
    <br>        
    <label>Tempo de plano</label>
    <!--Este imput deve receber o resultado de uma conta dos campos adesão e cancelamento da seguinte
    forma =cancelmamento - adesão e retornar a quantidade de meses que o beneficiario permaneceu com o 
    plano -->
    <input type="text" name="tempo" id="tempo" size="10"readonly="readonly" >
    <label>Individual</label>
    <!--Recebe valor artibuido ao select com o valor do plano-->
    <input type="text" id="individual" name="individual" size="10" oninput="calculaParcela()" >    
    <label>Parcela</label>
    <!--Parcela recebe a quantidade de dependentes vezes o valor individual-->
    <input type="text" name="parcela" id="parcela" size="10" readonly="readonly" >
    <label>Investimento</label>
    <!--Investimento deve mutiplicar a quantidade de meses vezes o valor da parcela para retorno do valor
    investido durante o tempo que o beneficiario permaneceu com o plano-->
    <input type="text" name="investimento" id="investimento" readonly="readonly" size="10">
    <br>
    <input type="button" value="calcular" onclick="calculaInvestimento()">      
    </fieldset>     
</form>
</body>
</html>

  • not actually I put the no select plan, a 29.90 value, I need a function that prints the value of a plan every time I change in select in the individual field

  • @Rafaeldiaszendron Could you explain better the desired behavior? In the question you said that you would like it to transfer the value of the plan to the Individual field whenever it is changed.

  • my code has a select that has the right fundamental plan its value is 29.90 I would like when selecting it the value of 29.90 to be displayed in the individual field understood

  • @Rafaeldiaszendron This is already happening, do the test in the code I posted above. Click the 'run' button in my reply and select the 'Fundamental' option in the field, the value in question 29,90 will appear in the 'individual' field'.

  • 1

    was that very well worth, thank you very much

  • Masa, I’m happy to help, then just accept the answer, please, to indicate to the community that the question in question has already been answered and the problem solved.

  • how do @Leandrosilva

  • @Rafaeldiaszendron Just click on the correct sign (it looks like a 'V') on the left side of the answer.

  • guy I tested the code I copied exactly your Jquery on ta working not here it worked normal and works and then I tried to open in the browser on ta working has some good debuguer?

  • @Rafaeldiaszendron Did you copy the jQuery script and import the jQuery library into the page’s head tag? <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> ? Remembering that in order for such code to work, as the library is on an external website it is necessary that the computer on which you are testing is connected to the internet.

  • @Leeandrosilva already tried downloading jquery and with it aparfir from Cdn google by the browser debug appears the jquery library so q num ta running the script, had had trouble with the $ all q put the library line before the functions.js recognized $ my code t equal to yours above with the edits and function q vc suggested testing in the browser nothing to work, I will edit my question and post as it got after your suggestions soon more

  • @Leandronsilva the code in my question is now already equal to yours only that it only works when run here when run directly in the browser is not running any suggestion

  • the code proposed in jquery in the browser runs before closing the </body> tag but cancels the split calculations preventing the investment the ideal would be how I edited above that runs the calculations but in the browser it ignores the jquery

Show 8 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.