| ||||||||||||||||
 StaffScripts Mandare un form in una pop-up | |||||||||||||||||||||||||
| Autore: Riccardo | Data: 28/03/2001 | Downloads: 1343 | Voto: 2,3/5 | Download | P r o v a | ||||||||||||||||||||
|
Mandare un form in una pop-up
Una mail ricevuta ieri mi ha fatto riflettere su una domanda che viene spesso postata nel NewsGroup it.comp.lang.javascript: Come far si che i risultati di un form si aprano in una pop-up invece che nella stessa pagina che contiene il form? Far aprire il form in una nuova finestra del browser è facile, basta mettere target="_new" nel tag: <FORM ... TARGET="_new">, mandarlo nella pop-up, invece, richiede che la pop-up venga aperta preventivamente. La mail riguardava un form per la ricerca di nomi a dominio liberi nel TLD ".it": <FORM NAME="SearchForm" METHOD="GET" ACTION="http://www2.nic.it/cgi-bin/Maintainer/wait.cgi" onSubmit="return Validate(this)"> <INPUT TYPE="hidden" NAME="NewUrl" VALUE="/cgi-bin/Maintainer/search.cgi"> <INPUT TYPE="text" NAME="Object" SIZE="27"> <INPUT TYPE="submit" VALUE="Invia"> - <INPUT TYPE="reset" VALUE="Cancella"> </FORM>Così com'è strutturato il risultato della ricerca finisce nella stessa pagina. Ma se dopo aver validato ll form apriamo la finestra otteniamo il risultato voluto: <HTML>
<HEAD>
<TITLE>JsDir - Form in pop-up</TITLE>
<SCRIPT>
<!--
function Validate(TheForm)
{
var invio=false;
/* Lo script di validazione va inserito qui.
* Se l'invio puo' essere eseguito la variabile "invio" diventa "true" altrimenti resta "false"
*/
if (invio==true)
{
fin=window.open("about:blank","fin","width=400,height=300");
timer=setTimeout("return true",200)
}
else
{
alert("Il form non puo' essere inviato");
return false;
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="SearchForm" METHOD="GET"
ACTION="http://www2.nic.it/cgi-bin/Maintainer/wait.cgi" onSubmit="return Validate(this)" TARGET="fin">
<INPUT TYPE="hidden" NAME="NewUrl" VALUE="/cgi-bin/Maintainer/search.cgi">
<DIV ALIGN="center"><FONT FACE="verdana, arial, helvetica" SIZE="-1"><B>Cerca domini.it </B><BR>
<INPUT TYPE="text" NAME="Object" SIZE="20" MAXLENGTH="27"> <BR> <BR>
<INPUT TYPE="submit" VALUE="Cerca"> - <INPUT TYPE="reset" VALUE="Cancella">
</FONT>
</DIV>
</BODY>
</HTML>
Il form è cambiato di poco: semplicemente abbiamo aggiunto target="fin". La finestra viene gestita direttamente dalla funzione validate(). La sintassi di validate() non dovrebbe cambiare di molto. Abbiamo bisogno di una variabile (invio), che preimpostiamo a false e che dovrà essere settata a true se il form può essere inviato. Subito dopo, prima di ritornare il valore al form controlliamo la variabile. Se è true apriamo la finestra con window.open() e dopo 200 ms confermiamo l'invio del form, altrimenti non apriamo la finestra e diamo un avviso con un alert() che è impossibile inviare il form, poi ritorniamo ancora il valore di invio al form che non sarà inviato. È chiaro che in quest'esempio ho messo l'alert nell'ultima parte dello script. Se la vostra funzione di validazione già avvisa l'utente l'alert() che vedete qui può essere omesso e resta solo il "return false;" per il form. Nel caso il form venga inviato ho messo un temporizzatore per lasciare al browser il tempo di aprire la nuova finestra e poi dare l'Ok al form. Sconsiglio di toglierlo, computer non troppo performanti, o con molti programmi aperti, potrebbero ritardare l'apertura della finestra. In ogni caso 200 millisecondi sono impercettibili per il visitatore. | |||||||||||||||||||||||||
| |||||||||||||||||||||||||
| Per navigare correttamente il sito è necessario abilitare i cookies. |
| Enjoy Open Source! |
Stampa
Segnala 
Preferiti 
