2009-06-16 5 views
1

Je voudrais transmettre des informations à un iframe par la poste. (Peut être jquery ou javascript qui exécute le post, cela n'a pas vraiment d'importance).Comment puis-je transmettre des informations à un iframe via Post dans ASP.NET?

Les informations ne peuvent pas être envoyées via la chaîne de requête, car je n'ai pas accès pour modifier la façon dont la page apportée par l'iframe est.

Ces données vont déterminer la mise en page du contenu de l'iframe. Comment puis-je faire en sorte qu'après l'envoi du message, iframe soit mis à jour? (peut-être actualiser?)

Répondre

1

J'ai écrit un blog post à propos de cela avec jQuery pour télécharger un fichier en utilisant un iframe caché. Voici le code:

Voici le code HTML pour le formulaire:

<div id="uploadform"> 
<form id="theuploadform"> 
<input type="hidden" id="max" name="MAX_FILE_SIZE" value="5000000" > 
<input id="userfile" name="userfile" size="50" type="file"> 
<input id="formsubmit" type="submit" value="Send File" > 
</form> 

Le DIV dans lequel pour permettre jQuery pour créer le iframe, vous pouvez le cacher avec un peu de CSS:

<div id="iframe" style="width:0px height:0px visibility:none"> 
</div> 

la DIV où pour afficher les résultats du rappel:

<div id="textarea"> 
</div> 

le code jQuery:

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 

$(document).ready(function(){ 
    $("#formsubmit").click(function() { 
     var userFile = $('form#userfile').val(); 
     var max = $('form#max').val(); 
     var iframe = $('<iframe name="postframe" id="postframe" class="hidden" src="about:none" />'); 
     $('div#iframe').append(iframe); 

     $('#theuploadform').attr("action", "uploader.php") 
     $('#theuploadform').attr("method", "post") 
     $('#theuploadform').attr("userfile", userFile) 
     $('#theuploadform').attr("MAX_FILE_SIZE", max) 
     $('#theuploadform').attr("enctype", "multipart/form-data") 
     $('#theuploadform').attr("encoding", "multipart/form-data") 
     $('#theuploadform').attr("target", "postframe") 
     $('#theuploadform').submit(); 
     //need to get contents of the iframe 
     $("#postframe").load(
      function(){ 
       iframeContents = $("iframe")[0].contentDocument.body.innerHTML; 
       $("div#textarea").html(iframeContents); 
      } 
     ); 
     return false; 
    }); 
}); 

</script> 

J'ai utilisé une application php comme ceci uploader.php faire quelque chose avec le fichier:

<?php 

$uploaddir = 'uploads/'; 
$uploadfile = $uploaddir . basename($_FILES['userfile']['name']); 
$maxfilesize = $_POST[MAX_FILE_SIZE]; 

if ($maxfilesize > 5000000) { 
//Halt! 
    echo "Upload error: File may be to large.<br/>"; 
    exit(); 
}else{ 
    // Let it go 
} 

if (move_uploaded_file($_FILES['userfile']['tmp_name'], $uploadfile)) { 
    print('File is valid, and was successfully uploaded. '); 
} else { 
    echo "Upload error: File may be to large.<br/>"; 
} 

chmod($uploadfile, 0744); 
?> 

Il y a plus là que vous avez besoin, mais il illustre le concept en jQuery.

+1

Wow. Tout ce code pour quelque chose de si simple? Vous pouvez utiliser l'attribut target du FORM, le mettre en corrélation avec l'attribut name de l'IFRAME, et il sera soumis naturellement! –

+0

@Josh, Pop que dans une réponse avec un peu de code puis;) –

0

Je n'ai pas le code à portée de main, mais mon équipe l'a fait uniquement en Javascript. Si je me souviens, il est allé quelque chose comme ceci:

function postToPage() { 
    var iframe = document.getElementById('myIFrame'); 

    if (iframe) { 
    var newForm = '<html><head></head><body><form...> <input type="hidden" name="..." value="..." /> </form><script type=\"text/javascript\">document.forms[0].submit();</scrip' + 't></body></html>'; 

    iframe.document.write(newForm); //maybe wrong, find the iframe's document and write to it 
    } 
}