Ciao, per rendere un campo input non modificabile da utente puoi usare l'attributo readonly. Chiaramente qualche utente malintenzionato puo andare a modificare il valore per vie traverse sul browser, per cui è sempre buona norma fare opportuni controlli lato server dopo l'invio dei dati.
Inoltre, se si tratta di HTML5, per i campi input in cui vanno inseriti numeri sarebbe più consono adoperare type=number. La maggior parte dei recenti browser presenta uno stepper affianco ad un campo number in modo da facilitarne l'inserimento dei dati.
In tal caso però bisogna eliminare gli attributi size e maxlength, non sono consentiti in un campo di tipo number. Nel caso puoi specificare opportunamente gli attributi min e max.
Per fare un calcolo automatico, funzionale, puoi usare qualche riga di javascript che aggiorni il risultato in tempo reale, man mano che vengono inseriti i dati.
Ti posto un esempio in base alle tue indicazioni:
Chiaramente si può risolvere in tanti altri modi.codice:<!DOCTYPE HTML> <html> <head> <title>Esempio</title> <meta charset="utf-8"> <script type="text/javascript"> var c1,c2,c3,c4,c5; function calcola(){ var v1 = c1.value; var v2 = c2.value; var v3 = c3.value; var v4 = c4.value; c5.value = v1-v2-v3-v4; } // Al caricamento della pagina window.onload = function(){ // I campi interessati al calcolo c1 = document.form.campo1; c2 = document.form.campo2; c3 = document.form.campo3; c4 = document.form.campo4; c5 = document.form.campo5; // Assegno un handler per richiamare la funzione calcola() automaticamente quando avviene una qualsiasi modifica dei valori nei campi c1.onchange = c1.onkeypress = c1.onpaste = c1.oninput = c2.onchange = c2.onkeypress = c2.onpaste = c2.oninput = c3.onchange = c3.onkeypress = c3.onpaste = c3.oninput = c4.onchange = c4.onkeypress = c4.onpaste = c4.oninput = calcola; // Se serve, puoi eseguire il calcolo ad apertura pagina per aggiornare il risultato nel caso i campi siano popolati in qualche modo preventivamente calcola(); } </script> </head> <body> <form action="#" method="post" name="form"> <input type="number" name="campo1" value="">Campo 1<br> <input type="number" name="campo2" value="">Campo 2<br> <input type="number" name="campo3" value="">Campo 3<br> <input type="number" name="campo4" value="">Campo 4<br> <hr> <input readonly type="text" name="campo5" value="">Campo 5<br> <hr> <input type="submit" value="Invia dati"> </form> </body> </html>


Rispondi quotando