[JS] Gestione numeri

[Alhazred]

Ho una tabella contenente degli ingredienti, il loro prezzo unitario e una casella di input dove richiedere la quanttà desiderata.
Quello che voglio fare tramite Javascript è catturare l'inserimento di una quantità e far apparire di volta in volta il prezzo parziale degli ingredienti scelti. Per adesso lo faccio con una finestra alert, ma poi vorrei che apparisse e restasse visibile sulla pagina.
Ho 3 problemi:
- ho scritto il codice della tabella e della funzione Javascript che fa il calcolo, ma quest'ultima mi fa apparire sempre il messaggio "Al momento la spesa è di NaN euro"

- vorrei che fosse possibile inserire solo numeri nelle caselle di input

- non so come passare alla funzione sia il quantitativo scelto che il prezzo unitario del prodotto (che al momento ha sempre lo stesso valore perché l'ho cablato nella funzione)

Vi riporto i frammenti di codice, sapreste aiutarmi?

Tabella

<table border="1">
      
        <tr>
          <td width="142" height="23"><div align="center">Ingrediente</div></td>
          <td width="114"><div align="center">prezzo </div></td>
          <td width="54"><div align="center">quantit&agrave;</div></td>
        </tr>
        <tr>
          <td height="26">Patate</td>
          <td><input name="prPatate" type="hidden" value="0.50" />0,50</td>
          <td valign="top"><input name="Patate" type="text" size="3" maxlength="3" onchange="totale(this.value)"/></td>
        </tr>
        <tr>
          <td height="26">Uova</td>
          <td><input name="prUova" type="hidden" value="0,08" />0,08</td>
          <td valign="top"><input name="Uova" type="text" size="3" maxlength="3" onchange="totale(this.value)"/></td>
        </tr>
        <tr>
          <td height="26">Peperoni</td>
          <td><input name="prPeperoni" type="hidden" value="0.60" />0,60</td>
          <td valign="top"><input name="Peperoni" type="text" size="3" maxlength="3" onChange="totale(this.value)"/></td>
        </tr>
        <tr>
          <td height="26">Carciofi</td>
          <td><input name="prCarciofi" type="hidden" value="3.20" />3,20</td>
          <td valign="top"><input name="Carciofi" type="text" size="3" maxlength="3" onchange="totale(this.value)"/></td>
        </tr>
        <tr>
          <td height="26">Spaghetti</td>
          <td><input name="prSpaghetti" type="hidden" value="0.80" />0,85</td>
          <td valign="top"><input name="Spaghetti" type="text" size="3" maxlength="3" onchange="totale(this.value)"/></td>
        </tr>
</table>

Funzione

function totale(quantita)
{
	var parziale;
	parziale = parziale + (0.08*quantita);
	alert("Al momento la spesa è di "+parziale+" euro");
}

[Alhazred]

Ho apportato questa modifica alla funzione

var parziale = 0;
function totale(quantita)
{
	parziale = parziale + (0.08*quantita);
	alert("Al momento la spesa è di "+parziale+" euro");
}

Adesso se inserisco un numero nella casella di input il conto viene fatto correttamente.
Restano gli altri due problemi:
- passare i due parametri alla funzione in modo che diventi così

function totale(prezzo,quantita)
{
	parziale = parziale + (prezzo*quantita);
	alert("Al momento la spesa è di "+parziale+" euro");
}

- Permettere nel campo di input solo numeri.

[br1]

var parziale = 0;
function totale(obj)
{
  q = "0"+obj.value.replace(/\D/g,"");
  obj.value = q;
  p = obj.form.elements["pr"+obj.name].value;
  parziale = parziale + (p*q);
  alert("Al momento la spesa è di "+parziale+" euro");
}

... con il richiamo onchange="totale(this)"

Invece dell'alert puoi valorizzare un campo "prztotale" dello stesso form:

obj.form.prztotale.value = parziale;

Rimane il problema di eventuali variazioni alle quantita' gia' imputate... provaci.

ciao

[Alhazred]

Grazie Br1, sono riuscto a mettere in pratica tutte le tue indicazioni e funziona a dovere (per quel che volevo fare per ora).
Ho anche messo un campo nel form che aggiorna il totale parziale invece di farlo apparire in un alert.
Solo una cosa a riguardo, ho usato un campo input di tipo text, ma ovviamente questo può essere editato a mano e non è un granché, cosa potrei usare per fare in modo che l'importo sia solo visualizzato e non modificabile se non cambiando i valori delle quantità volute?

[br1]

<input type="text" ... readonly />

ciao

[Alhazred]

Bene, questa del readonly non la sapevo, grazie

Adesso vedo un po' come fare per gestire correttamente i ripensamenti sulle quantità.