Questa tecnica che andrò ad illustrare brevemente è alla base di molti caricamenti asincroni di file tramite AJAX. In pratica il contenuto di una richiesta POST viene reindirizzato ad un elemento iframe. Infatti AJAX non può caricare file per l'upload, ma si può utilizzare questa tecnica HTML per poter bypassare questa limitazione.
La tecnica è molto semplice:
<form action="iframe.php" target="iframe" method="post">
<div>
<label for="text">Testo</label>
<input type="text" name="text" id="text" />
<input type="submit" value="Post" />
</div>
</form>
<iframe name="iframe" src="iframe.php"></iframe>
In pratica l'URL dell'azione predefinita del form corrisponde all'URL caricato dall'elemento iframe. Dato che gli attributi target e name sono deprecati, si può usare una versione più standard dell'esempio e utilizzare jQuery per impostare gli attributi richiesti:
<form action="iframe.php" method="post" id="form">
<div>
<label for="text">Testo</label>
<input type="text" name="text" id="text" />
<input type="submit" name="submit" id="submit" value="Post" />
</div>
</form>
<iframe id="iframe" src="iframe.php"></iframe>
E con jQuery avremo:
$('#form').attr('target', 'iframe');
$('#iframe').attr('name', 'iframe');