Controlli su caratteri
Gli argomenti di questa pagina
|
Maiuscolare i caratteri
Il problema da risolvere è quello del controllo sui caratteri immessi in una area di testo durante la digitazione. L'istruzione JS da usare per ottenere questo risultato è brevissima per cui non occorre aggiungere alcuna funzione personale ma è sufficiente aggiungere l'istruzione nell'onkeyup del controllo TXT.
In una casella di testo contenuta in un Form si desidera maiuscolare il carattere appena inserito intercettando il tasto premuto.
L'evento da usare è "onkeyup" e la funzione JS da usare è "toUpperCase".
La funzione toUpperCase() converte una stringa nella rispettiva stringa in maiuscolo.
1
|
<form name="ciccio" method="post" action="">
|
Inserire solo numeri: primo esempio
Lo script JS viene così richiamato nella pagina.
Ovviamente lo script è compilato in un file esterno (per esempio isnumberkey.js) e viene richiamato nella pagina in questo modo:
1
|
<script type="text/javascript" src="js/isnumberkey.js"></script>
|
Questa è una piccola funzione che permette di controllare che in una casella di testo si inseriscano solo numeri.
1
|
function isNumberKey(evt){
|
1
|
<input type="text" name="numeric" maxlength="7" size="50" onkeypress="return isNumberKey(event)" />
|
Qui sotto c'è un esempio del form in cui è possibile inserire solo numeri. Gli altri caratteri sono ignorati. Le cifre inseribili sono sette (maxlength="7")
1
|
<form name="numeri" method="post" action="">
|
Prova inserimento caratteri numerici per il primo esempio
Inserire solo numeri: secondo esempio
Lo script JS viene così richiamato nella pagina.
Ovviamente lo script è compilato in un file esterno (per esempio control_numberic_field.js) e viene richiamato nella pagina in questo modo:
1
|
<script type="text/javascript" src="js/control_numberic_field.js"></script>
|
Questa è una piccola funzione che permette di controllare che in una casella di testo si inseriscano solo numeri, ma questa volta è possibile usare anche il punto come carattere separatore tra le cifre.
1
|
function control_numberic_field(campo,tipo) {
|
1
|
<input id="numero" onkeyup="return(control_numberic_field(this,this.name))" name="numero" type="text" />
|
Qui sotto c'è un esempio del form in cui è possibile inserire solo numeri. Gli altri caratteri, ad eccezione del punto, sono ignorati.
1
|
<form name="number_only" method="post" action="">
|
Prova inserimento caratteri numerici per il secondo esempio
Inserire solo numeri: terzo esempio
Lo script JS viene così richiamato nella pagina.
Ovviamente lo script è compilato in un file esterno (per esempio numeric.js) e viene richiamato nella pagina in questo modo:
1
|
<script type="text/javascript" src="js/numeric.js"></script>
|
In questo terzo esempio il controllo viene eseguito tramite una espressione regolare che, oltre ad accettare i caratteri esclusivamente numerici, permette anche l'inserimento di alcuni altri caratteri.
1
|
function numeric(champ) {
|
1
|
<input type="text" name="numbers" size="50" onkeyup="return numeric(this)" />
|
Qui sotto c'è un esempio del form in cui è possibile inserire solo numeri. Gli altri caratteri, ad eccezione del punto, sono ignorati.
1
|
<form name="numerici" method="post" action="">
|
Prova inserimento caratteri numerici per il terzo esempio
Inserire caratteri alfabetici
Lo script JS viene così richiamato nella pagina.
Ovviamente lo script è compilato in un file esterno (per esempio control_numberic_field.js) e viene richiamato nella pagina in questo modo:
1
|
<script type="text/javascript" src="js/alfabetic.js"></script>
|
E' questa un'altra funzione per il controllo dell'inserimento di caratteri in una casella di testo. Questa volta vogliamo controllare che vengano inseriti solo caratteri alfabetici.
Questa volta facciamo uso di una espressione regolare che fa in modo da accettare tutti i caratteri alfabetici, punti, virgole, spazi, apici semplici e le vocali accentate. Il problema in questo caso è come fare in modo di fargli riconoscere le vocali accentate. Sfortunatamente la sequenza " \é\è\ò\à\ù\ì " non viene riconosciuta per cui è stato necessario usare le sequenze unicode " \u00E0\u00E8\u00EC\u00F2\u00F9 ". Grazie a questa sequenza è possibile trattare anche le vocali accentate.
La sequenza completa si è così trasformata in " [a-zA-Z\., \'\u00E0\u00E8\u00EC\u00F2\u00F9] ".
1
|
function alfabetic(champ) {
|
1
|
<input type="text" name="alfabetic" size="50" onkeyup="return alfabetic(this)" />
|
Qui sotto c'è un esempio del form in cui è possibile inserire solo numeri. Gli altri caratteri sono ignorati. Le cifre inseribili sono sette (maxlength="7")
1
|
<form name="alfa" method="post" action="">
|
Prova inserimento caratteri alfabetici