Modificare un testo a seconda di un parametro

**Alhazred** · 10-07-2008, 22:55

Ho una tabella con nomi di ingredienti e quantità residue.
Sotto ci sono un campo di input di tipo testo e un pulsante per la conferma.
La funzione deve fare questo, una volta premuto il pulsante prende il valore nel campo di input e tutti i campi della tabella sovrastante con valore nella colonna "Quantità" inferiore a tale numero devono cambiare colore, diciamo rosso.
Idee su come realizzare la cosa?
Mi bastano indicazioni per ora, il codice vedrò di scriverlo io.
Per ora la struttura è questa, ovviamente può essere cambita come più conviene.

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Evidenzia soglia</title>

<script type="text/javascript">
<!--
function modifica(obj)
{

}
//-->
</script>

</head>

<body>
<form name="lista" action="">
<table border="0" width="auto">
  <tbody>
    <tr>
      <td height="23" width="95">
        <div align="left"> Ingrediente </div>
      </td>
      <td width="90">
        <div align="left"> Quantità </div>
      </td>
	</tr>
	<tr>
	  <td>Patate</td>
	  <td><input type="text" value="12" name="Patate" readonly /></td>
	</tr>
	<tr>
	  <td>Uova</td>
	  <td><input type="text" value="32" name="Uova" readonly /></td>
	</tr>
	<tr>
	  <td>Peperoni</td>
	  <td><input type="text" value="8" name="Peperoni" readonly /></td>
	</tr>
	<tr>
	  <td>Carciofi</td>
	  <td><input type="text" value="3" name="Carciofi" readonly /></td>
	</tr>
	<tr>
	  <td>Spaghetti</td>
	  <td><input type="text" value="56" name="Spaghetti" readonly /></td> 
	</tr>
	<tr>
	  <td><input type="text" value="0" name="soglia" /></td>
	  <td><input type="button" value="Modifica soglia" onclick="modifica(this)" /></td>
	</tr>
  </tbody>
</table>
</form>
</body>
</html>

**Alhazred** · 11-07-2008, 00:44

Ho provato a fare qualcosa e mi è venuto fuori questo, ma non funziona correttamente.
Ad esempio se si mette come input 40, i numeri 12, 32 e 3 diventano rossi, ma l'8 no, nonostante con un alert abbia visto che l'if controlla la disuguaglianza 8<40 che deve dare true, invece no, non esegue l'istruzione prevista dal true.
Da cosa dipende?

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Evidenzia soglia</title>

<script type="text/javascript">
<!--
var ingredienti = new Array("Patate","Uova","Peperoni","Carciofi","Spaghetti");

function evidenzia(obj)
{
  var i = 0;

  for(i = 0; i < ingredienti.length; i++)
    if(obj.form.elements[ingredienti[i]].value < obj.form.soglia.value)
      document.getElementById(ingredienti[i]).style.color = "#FF0000";
    else
      document.getElementById(ingredienti[i]).style.color = "#000000";
}
//-->
</script>

</head>

<body>
<form name="lista" action="">
  <table border="0" width="175">
    <tbody>
      <tr>
        <td height="23" width="95"><div align="left">Ingrediente</div></td>
        <td width="80"><div align="left">Quantità</div></td>
	    </tr>
	    <tr>
	      <td>Patate</td>
	      <td><input type="text" value="12" name="Patate" id="Patate" size="4" readonly /></td>
	    </tr>
	    <tr>
	      <td>Uova</td>
	      <td><input type="text" value="32" name="Uova" id="Uova" size="4" readonly /></td>
	    </tr>
	    <tr>
	      <td>Peperoni</td>
	      <td><input type="text" value="8" name="Peperoni" id="Peperoni" size="4" readonly /></td>
	    </tr>
	    <tr>
	      <td>Carciofi</td>
	      <td><input type="text" value="3" name="Carciofi" id="Carciofi" size="4" readonly /></td>
	    </tr>
	    <tr>
	      <td>Spaghetti</td>
	      <td><input type="text" value="56" name="Spaghetti" id="Spaghetti" size="4" readonly /></td> 
	    </tr>
	    <tr>
	      <td><input type="text" value="0" name="soglia" size="4" /></td>
	      <td><input type="button" name="Controlla" value="Controlla" onclick="evidenzia(this)" /></td>
	    </tr>
    </tbody>
  </table>
</form>
</body>
</html>

**Alhazred** · 11-07-2008, 01:19

Allora, sembra di aver capito che il confronto lo fa solo con la prima cifra dei numeri ovvero: se metto 40 il confronto viene fatto solo usandon il 4, quindi 8<4 da false, tant'è vero che se come input metto 9, anche 56 diventa rosso perché 5<9...
Come si risolve questa situazione?

**Alhazred** · 11-07-2008, 01:24

Vabbè, ho fatto tutto da solo

E' bastato usare parseInt()

Discussione: Modificare un testo a seconda di un parametro

Strumenti discussione

Ricerca discussione

Visualizza

Modificare un testo a seconda di un parametro

Permessi di invio