Jquery File Upload Hidden IFrame

Question

I needed a quick explanation on how to get an AJAX style file upload going using a hidden iframe. Here\'s the portion of the HTML code pertaining to the form:

Answer 1

Well, I've used something like that:

$("#upload_target")[0].contentWindow.document.body.innerHTML

... instead. But the general approach is similar: check this string, and if it's empty, just do nothing (i.e., return immediately). Otherwise proceed with analyzing this json.

Answer 2

i use this code, and work for me:

$(document).ready(function(){
    $('form#myform').submit(function(){
          $("#hiddenIframe").remove();    
          $('<iframe name="hiddenIframe" />').appendTo('body').attr({'id': 'hiddenIframe'});
          var Frame = $('#hiddenIframe');
          var newSrc = 'about:blank?nocache=' + Math.random(); //force new URL
          Frame.attr('src', newSrc); 
          var iframe = $('#hiddenIframe').load(function(){
              var response = iframe.contents().find('body').html();
              var txt = $.parseJSON(response);
              $('#message').append(txt.message);
              if(txt.error == false){
                   $.ajax({
                       type: 'POST',
                       url: '?myurl',
                       dataType: 'json',
                       data: {
                           //some data
                       },
                       success: function(data){
                           //some action
                       } 
                   });                                         
              }           
         });                                             
    });
});

This generate a new iframe on each submit, my PHP part

$this->message['error'] = true;
$this->message['message'] = "Problem!";

echo/print json_encode($this->message);

Try this