[Resolvido] Campos com mesmo nome em um formulário javascript
Calma, parece loucura, mas o que eu quero tem uma lógica.
Gostaria de saber se tem como eu tratar vários campos de maneiras diferentes em um mesmo formulário com todos os campos com o mesmo nome.
Eu tenho um código que muda a cor de fundo do formulário de acordo com o que o usuário digita: Se ele digitar "OK" fica verde, se digitar "ATRASO" fica vermelho. Porém, eu quero que esse formulário tenha vários campos com o mesmo nome, mas mude a cor de cada um de acordo com o conteúdo. Segue o código do meu formulário funcionando para apenas 1 campo, FUNCIONANDO.
<html>
<head>
<script type="text/javascript">
function verifica() {
var campo = document.nomeform;
if(campo.sta.value == "OK"){
document.getElementById("sta").style.background = "green";
document.getElementById("sta").style.color = "white";
}
if(campo.sta.value == "ATRASO"){
document.getElementById("sta").style.background = "red";
document.getElementById("sta").style.color = "white";
}
}
</script>
</head>
<body>
<table border="1">
<form name="nomeform" id="for" action="#.html">
<tr>
<td>
<center>Status
</td>
</tr>
<tr>
<td>
<input type="text" name="sta" value="" id="sta" style="font-weight: bold; text-align:center " onkeyup="verifica()">
</td>
</tr>
</table>
<input type="submit" value="Confirma">
</form>
</body>
</html>
Eu quero adicionar vários campos com o mesmo nome, mas que a cor mude em cada um de acordo com o preenchimento. Como seria:
<html>
<head>
<script type="text/javascript">
function verifica() {
var campo = document.nomeform;
if(campo.sta.value == "OK"){
document.getElementById("sta").style.background = "green";
document.getElementById("sta").style.color = "white";
}
if(campo.sta.value == "ATRASO"){
document.getElementById("sta").style.background = "red";
document.getElementById("sta").style.color = "white";
}
}
</script>
</head>
<body>
<table border="1">
<form name="nomeform" id="for" action="#.html">
<tr>
<td>
<center>Status
</td>
<td>
<center>Status 1
</td>
<td>
<center>Status 2
</td>
</tr>
<tr>
<td>
<input type="text" name="sta" value="" id="sta" style="font-weight: bold; text-align:center " onkeyup="verifica()">
</td>
<td>
<input type="text" name="sta" value="" id="sta" style="font-weight: bold; text-align:center " onkeyup="verifica()">
</td>
<td>
<input type="text" name="sta" value="" id="sta" style="font-weight: bold; text-align:center " onkeyup="verifica()">
</td>
</tr>
</table>
<input type="submit" value="Confirma">
</form>
</body>
</html>Discussão (32)
Carregando comentários...