Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom Dia
Estou com o seguinte problema:
tenho uma página que me traz a lista de alunos de uma determinada sala, nesta página tenho um form com vários input text - 3 deles são para notas e um para média - gostaria de fazer o calculo automático assim:
(nota1 + nota2 + nota3)/3 = media
estou utilizando o seguinte script :
<script language=javascript>
function media(){
document.frmenvia.media[].value = (eval(document.frmenvia.nota[].value) + eval(document.frmenvia.nota1[].value) + eval(document.frmenvia.quali[].value))/3;
}
</script>e o campos do form:
<input name="nota[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" onkeyup="media();" value="" size="5"/>
<input name="nota1[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" onkeyup="media();" value="" size="5"/>
<input name="quali[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" onkeyup="media();" value="" size="5"/>
<input name="media[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>Como podem ver os input text são arrays - por isto no nome o [] - para que na próxima pagina eu possa recupera-los e adicionar ao BD.
Porem o script não funciona e não dá nenhum erro - sei que é por causa do nome estar com "[]", existe alguma solução ???
Agradeço qualquer ajuda.
Obrigado mas infelizmente não funcionou ... não faz a media ...
Acho que você testou no IE, aqui no IE realmente não funcionou... veja assim:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function mediaFinal(){
document.frmenvia["media[]"].value = (eval(document.frmenvia["nota[]"].value) + eval(document.frmenvia["nota1[]"].value) + eval(document.frmenvia["quali[]"].value)) / 3;
}
</script>
<title>HTML5</title>
</head>
<body>
<form name="frmenvia">
<input name="nota[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';" value="" size="5"/>
<input name="nota1[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';" value="" size="5"/>
<input name="quali[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';" onKeyUp="mediaFinal();" value="" size="5"/>
<input name="media[]" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';"size="5"/>
</form>
</body>
</html>Fiz as alterações mas não funciona na minha página ...
você percebeu que são "N" input text ou seja conforme a quantidade de alunos na serie ...
O seu script funciona legal se for apenas 1 input text de cada nota ... mas como são vários ... ele não funfa ...
Obrigado pela ajuda ...
Aconselho então é criar um contador de campos, verifique quantos campos têm e faz o seguinte:
Joga um loop para pegar o ID dinamico deles, e substitui pelo que mandei
Obrigado amigo ...
vou tentar,mas não conheço muito de js ...
Abraços
Se precisar... ajudamos com isso, mais o importante é, entender o que postei!
Entendi ...
Devo criar inputs com nomes -> nota[0], nota[1], nota[2], etc ... atraves da quantiodade de linhas que vierem do MYSQL ...
Posso tentar nomear atraves do PHP ...
Preciso de um help seu TEd K
o que consegui até agora :
depois de muitas pesquisas consegui fazer um loop e estou com os inputs assim:
<input name="nota[]" id="nota_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>
<input name="nota1[]" id="nota1_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>
<input name="quali[]" id="quali_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>
<input name="media[]" id="media_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>Então os id estão assim -> nota_0, nota1_0, quali_0, media_0, nota_1, nota1_1, etc
Como adaptar seu codigo pelo id do input e gerar um loop no js ?
continuo pesquisando ...
conta quantos campos input têm...
joga um for que é semelhante ao php an função... e gera as propriedades!
Preciso de um help ... estou quase lá ...
estou usando o seguinte dódigo:
<script type="text/javascript">
function startCalc() {
interval = setInterval("mediaTotal()",1);
}
function mediaTotal() {
var a = eval(document.getElementById('nota_'+'<?php echo $x ?>').value);
var b = eval(document.getElementById('nota1_'+'<?php echo $x ?>').value);
var c = eval(document.getElementById('quali_'+'<?php echo $x ?>').value);
var d = eval(a + b + c)/3;
document.getElementById('media_'+'<?php echo $x ?>').value = d;
}
function stopCalc() {
clearInterval(interval);
}
</script>e nos inputs:
<input name="nota[]" id="nota_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>
<input name="nota1[]" id="nota1_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" size="5"/>
<input name="quali[]" id="quali_<?php echo $x ?>" type="text" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66'" value="" onkeyup="startCalc();" size="5"/>
<input name="media[]" type="text" id="media_<?php echo $x ?>" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';" onblur="stopCalc();" size="5"/>Ele está calculando apenas a 1ª linha ...
Não use eval().
Se não uso eval() ele faz o seguinte:
nota -> 5 nota1 -> 4 quali -> 8 media -> 548
ele não soma ...
tem outra sugestão ????
Resolvido:
Depois de muito martelar aqui vai o código caso alguém tenha esse problema no futuro - está também arredondado:
<script type="text/javascript">
function startCalc() {
interval = setInterval("mediaTotal()",1);
}
function mediaTotal() {for (x = 0; x < document.getElementsByName("media[]").length; x++) {
var a = document.getElementById('nota_'+x).value;
var b = document.getElementById('nota1_'+x).value;
var c = document.getElementById('quali_'+x).value;
var d = (+a + +b + +c)/3;
d = Math.round(d*2);
document.getElementById('media_'+x).value = (d/2);
}
}
function stopCalc() {
clearInterval(interval);
}
</script>Os inputs ficaram assim:
<input name="nota[]" type="text" id="nota_<?php echo $x ?>" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';startCalc();" onblur="stopCalc()" size="5"/>
<input name="nota1[]" type="text" id="nota1_<?php echo $x ?>" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';startCalc();" onblur="stopCalc();" size="5"/>
<input name="quali[]" type="text" id="quali_<?php echo $x ?>" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';startCalc();" onblur="stopCalc();" size="5"/>
<input name="media[]" type="text" id="media_<?php echo $x ?>" style="width:50px" onfocus="this.style.backgroundColor='#CCFF66';" size="5"/>Você conseguiu fazer o codigo funcionar e tirar as medias das outras linhas?
Sim funciona em todas s linhas ...
Assim amigo: