Javascript Budget [closed]

Question

Javascript Budget [closed]

Navigation

#1 by (0 votes)

0

I'm trying to create this budget but I can not do it! The page is in the CMS joomla and the javascript I am included in the module, so I do not need to include the library because it already is. The idea is this: * The customer types in the quantity of parts he wants. * in a row choose how many colors these shirts will have (each more colors become more expensive) * Then choose the type of shirt (here you do not need to calculate) * Finally the last input would bring me the calculation * The calculation would look like this: Quantity of colors * 25 / quantity of pieces.

Someone help me please?

<script>
function calcular(){
    var qtde_pecas = parseInt(document.getElementById('qtde_pecas').value, 10);
    var r3 = (document.getElementById('r3').value, 3);
    var r35 = (document.getElementById('r35').value, 3.5);
    var r4 = (document.getElementById('r4').value, 4);
    var r45 = (document.getElementById('r45').value, 4.5);
    var r5 = (document.getElementById('r5').value, 5);
    var r55 = (document.getElementById('r55').value, 5.5);
    var r6 = (document.getElementById('r6').value, 6);
    var r65 = (document.getElementById('r65').value, 6.5);
    document.getElementById('valor_unit1').value =  r3 * 25 / qtde_pecas;
}
 
</script>

<form class="orcamento" id="orcamento-pecas">
            	<div class="qtde_pecas">
                	<label class="title-pecas">Quantidade de Peças</label><input type="number" id="qtde_pecas" name="qtde-pecas" value="" maxlength="2" size="1" min="1" max="1" onkeyup="calcular();">  
              	</div>  
               	<div class="qtde_cores">
                	<label class="title-cores">Quantidade de Cores</label>
                  		<select id="qtde_cores">
                          <option value="3" id="r3" onkeyup="calcular();">01</option>
                          <option value="3,5" id="r35" onkeyup="calcular();">02</option>
                          <option value="4" id="r4"onkeyup="calcular();" >03</option>
                          <option value="4,5" id="r45"onkeyup="calcular();">04</option>
                          <option value="5" id="r5" onkeyup="calcular();">05</option>
                          <option value="5,5" id="r55" onkeyup="calcular();">06</option>
                          <option value="6" id="r6" onkeyup="calcular();">07</option>
                          <option value="6,5" id="r65" onkeyup="calcular();">08</option>
               		  </select>
                  

              	</div>  
                <div class="tipo_malha">
                  <label class="title-malha">Tipo de Malha</label>
              		<select class="tipo-malha" id="tipo-malha">
                  	<option value="">Camiseta PV Branco</option>
                    <option value="">Camiseta PV Colorido</option>
                    <option value="">Camiseta Algodão Branco</option>
                    <option value="">Camiseta Algodão Colorida</option>
                    <option value="">Camiseta Dryfit</option>
                    <option value="">Camiseta Poliamida</option>
                    <option value="">Blusa Moletom Canguru</option>
                    <option value="">Blusa Moletom Ziper</option>
                    <option value="" >Polo Piquet</option>
                    <option value="">Polo PV</option>
                </select>
              	</div> 
                
                
              	<div class="valor_unit">
              <label class="title-unit">Valor Unitario</label><input type="number" id="valor_unit1" name="valor-unit" value="">    
              </div>  
              
            </form>

javascript

asked by anonymous 26.09.2017 / 15:50

1 answer

Select row in datagridwier and write to database Generate sql script on a given date

score 0 · Accepted Answer

Just take the value of option replace the comma by point so that you can do math operation. No select put onchange="calcular(); and remove the options function.

function calcular(){
    var qtde_pecas = (document.getElementById('qtde_pecas').value);
    var qtde_cores =(document.getElementById('qtde_cores').value).replace(",", ".");

    document.getElementById('valor_unit1').value =  ((qtde_cores * 25)/qtde_pecas).toFixed(2);
}

<form class="orcamento" id="orcamento-pecas">
	<div class="qtde_pecas">
		<label class="title-pecas">Quantidade de Peças</label><input type="number" id="qtde_pecas" name="qtde-pecas" value="" maxlength="2" size="1" min="1" max="1" onkeyup="calcular();">  
	</div>  
	<div class="qtde_cores">
		<label class="title-cores">Quantidade de Cores</label>
		<select id="qtde_cores" onchange="calcular();">
		<option value="3" id="r3">01</option>
		<option value="3,5" id="r35">02</option>
		<option value="4" id="r4">03</option>
		<option value="4,5" id="r45">04</option>
		<option value="5" id="r5">05</option>
		<option value="5,5" id="r55">06</option>
		<option value="6" id="r6">07</option>
		<option value="6,5" id="r65">08</option>
		</select>               
	</div>  
	<div class="tipo_malha">
		<label class="title-malha">Tipo de Malha</label>
		<select class="tipo-malha" id="tipo-malha">
		<option value="">Camiseta PV Branco</option>
		<option value="">Camiseta PV Colorido</option>
		<option value="">Camiseta Algodão Branco</option>
		<option value="">Camiseta Algodão Colorida</option>
		<option value="">Camiseta Dryfit</option>
		<option value="">Camiseta Poliamida</option>
		<option value="">Blusa Moletom Canguru</option>
		<option value="">Blusa Moletom Ziper</option>
		<option value="" >Polo Piquet</option>
		<option value="">Polo PV</option>
		</select>
	</div> 
                
                
	<div class="valor_unit">
		<label class="title-unit">Valor Unitario</label><input type="number" id="valor_unit1" name="valor-unit" value="">    
	</div>  
              
</form>

According to the new mathematical formula given in the comments, we have

function calcular(){
    
    var qtde_pecas = (document.getElementById('qtde_pecas').value);
    if (qtde_pecas<15){
    	cincoReais=5;
    }else{
    	cincoReais=0;
    }
    
    //if (qtde_pecas!=""){
	    var textoOption = document.getElementById('qtde_cores').options[document.getElementById('qtde_cores').selectedIndex].text;
	    var qtde_cores =(document.getElementById('qtde_cores').value).replace(",", ".");
	    var tipo_malha =(document.getElementById('tipo_malha').value).replace(",", ".");
	    document.getElementById('valor_unit1').value =  (((textoOption * 25)/qtde_pecas)+Number(qtde_cores)+Number(tipo_malha)+cincoReais).toFixed(2);
    //}else{
    	//alert("digite qtde_pecas");
    //}
}

<form class="orcamento" id="orcamento-pecas">
	<div class="qtde_pecas">
		<label class="title-pecas">Quantidade de Peças</label><input type="number" id="qtde_pecas" name="qtde-pecas" value="" maxlength="2" size="1" min="1" max="1" onkeyup="calcular();">  
	</div>  
	<div class="qtde_cores">
		<label class="title-cores">Quantidade de Cores</label>
		<select id="qtde_cores" onchange="calcular();">
		<option value="3" id="r3">01</option>
		<option value="3,5" id="r35">02</option>
		<option value="4" id="r4">03</option>
		<option value="4,5" id="r45">04</option>
		<option value="5" id="r5">05</option>
		<option value="5,5" id="r55">06</option>
		<option value="6" id="r6">07</option>
		<option value="6,5" id="r65">08</option>
		</select>               
	</div>  
	<div class="tipo_malha">
		<label class="title-malha">Tipo de Malha</label>
		<select class="tipo_malha" id="tipo_malha" onchange="calcular();">
		<option value="3,5">Camiseta PV Branco</option>
		<option value="4">Camiseta PV Colorido</option>
		<option value="4,5">Camiseta Algodão Branco</option>
		<option value="5">Camiseta Algodão Colorida</option>
		<option value="6">Camiseta Dryfit</option>
		<option value="7">Camiseta Poliamida</option>
		<option value="8">Blusa Moletom Canguru</option>
		<option value="9">Blusa Moletom Ziper</option>
		<option value="10" >Polo Piquet</option>
		<option value="5">Polo PV</option>
		</select>
	</div> 
                
                
	<div class="valor_unit">
		<label class="title-unit">Valor Unitario</label><input type="number" id="valor_unit1" name="valor-unit" value="">    
	</div>  
              
</form>