Vai a: [ Contenuti ] [ Categorie ] [ Cerca ]

I Form: risposte a domande frequenti

I Form: risposte a domande frequenti


È possibile limitare i caratteri inseribili di una textarea?

Ovviamente sì… e sempre grazie a javascript. Ecco come sarà strutturata la pagina:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 
<html>
<head>
  <title>Limita Textarea</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit)
field.value = field.value.substring(0, maxlimit);
else
countfield.value = maxlimit - field.value.length;
}
// End -->
</script>
 
</head>
<body>
 
<form name="saibal" action="...." method="post">
<input name="prova" type="text" size="25">
 
<textarea name="tarea" rows="5" cols="20" onKeyDown="textCounter(document.saibal.tarea,document.saibal.mostra,100);" onKeyUp="textCounter(document.saibal.tarea,document.saibal.mostra,100);"></textarea>  
 
<input readonly type="text" name="mostra" size="3" value="100">  Max Caratteri
<input type="submit" name="submit" value="Clicca & Godi">
</form>
 
</body>
</html>

Il javascript tra i tag <head> non va toccato; ciò che dobbiamo personalizzare sono le due stringhe da inserire nel tag textarea:

1
onKeyDown="textCounter(document.saibal.tarea,document.saibal.mostra,100);"
1
onKeyUp="textCounter(document.saibal.tarea,document.saibal.mostra,100);"

I valori in neretto sono quelli da personalizzare:

  • saibal è il nome del form
  • tarea è il nome della textarea
  • mostra è il nome del piccolo box che contiene i caratteri rimanenti
  • 100 è il numero dei caratteri da conteggiare. Il valore deve essere uguale in tutte e due le stringhe

È possibile rendere un campo non modificabile anche con Netscape 4.x?

Come sapete l'attributo "readonly" è valido solo per Explorer e, a partire dalla versione 6, anche per per Netscape. Ma ovviamente Navigator 4.x non è così generoso con noi quindi, ancora una volta, bisogno ricorrere a javascript.
Personalmente conosco due soluzioni: a voi la scelta di quella che vi piace di più.
La prima, proposta da Massimo61 sul nostro forum, è decisamente veloce e utilizza l'istruzione onFocus="this.blur()" in questa maniera:

1
2
3
4
<form name="saibal" action="...." method="post">
<input name="prova" type="text" size="25" onFocus="this.blur()">
<input type="submit" name="submit" value="Clicca & Godi">
</form>

La seconda è più lunga ma ugualmente funzionale:

1
2
3
4
<form name="saibal" action="...." method="post">
<input type="text" name="prova" value="non modificabile" onFocus="(this.disabled); { this.value = saveValue; setTimeout(&#039;document.saibal.prova.blur()&#039;,1); } "> 
<input type="submit" name="submit" value="Clicca & Godi">
</form>

E, dopo il tag di chiusura del form, inseriamo questo breve codice:

1
2
3
4
5
6
<script language="JavaScript">
<!-- 
document.nomeform.text.disabled = true; 
saveValue="non modificabile"; 
//-->
</script>

Anche in questo caso ricordo di personalizzare le stringhe document.saibal.prova con il nome del proprio modulo e del proprio campo.

Non ho di certo esaurito l'argomento ma spero di aver dato dei buoni spunti per dimostrare che i moduli, alla fine, non sono così difficili da gestire come si crede.
Con qualche nozione in più di css, javascript e html possiamo rendere un modulo perfettamente visibile anche con Netscape 4.x e vi assicuro che, se siete riusciti a superare lo stress creato da quello che alcune persone chiamano browser, siete pronti per affrontare qualsiasi cosa.

Pagina: 1 2 [3]

link sponsorizzati

Consiglialo su Facebook

Scrivi un commento

Commenti totali: 2


  1. Ciao! Complimenti per l'articolo!
    Avrei una domanda da fare:

    <input type="text" target="nascosto" name="sender_email" size="16"><br><br>
    Messaggio:<br><textarea name="msg" rows="8" cols="35"></textarea><br><br>

    In questa stringa:

    <input type="submit" name="submit" target="nascosto" value="INVIA">

    ho provato ad inserire uno dei seguenti comandi:

    onClick="this.form.msg.value=''"

    onSubmit="this.form.msg.value=''"

    per resettare il form dopo l'invio… ma così facendo mi da errore!
    Come posso resettare automaticamente il campo testo dopo l'invio?
    Grazie mille!

    Davide

  2. che intendi per "resettare il form" dopo l'invio?

Lascia un Commento

Iscriviti alle discussione senza commentare

Torna: [ Inizio ] [ Contenuti ] [ Categorie ] [ Cerca ]

Pagina renderizzata in soli 0,417 secondi dopo aver eseguito ben 58 query. Wordpress... prestazioni da urlo!