jqueryダイアログの画像をアップロードする

Question

「アップロード」jqueryダイアログボックスがあり、htmlアップロードフォームが表示されます。私はPHPフォームの提出をどこに置くことができないので、コードが動作していることを確認できます。 また、ページの編集中に画像がアップロードされているため、ページがリロードされず、変更が失われないことが重要です（画像を追加する前に編集内容を保存しません）。どのように私はアップロードを提出し、ダイアログボックス内のすべてを保持してページが再ロードされないようにし、アップロードされたイメージをページに挿入するための '挿入'コードを作成できますか？ おかげで、私のコードは次のとおりです。

public static function uploadImage(){ 
global $wgOut, $wgRequest; 

    $posted = $wgRequest->wasPosted(); 
    if($posted) { 
    $wgOut->addHtml(' Maximum upload size: 2M <br />'); 
     } 
    // form processing message set at the top if(!empty($message)){$wgOut->addHtml('$message'); }; 
    $wgOut->addHtml(' Upload an Image from your computer: <br />'); 
    $wgOut->addHtml('<form action="" enctype="multipart/form-data" method="Post"> 
      <input type="hidden" name="MAX_FILE_SIZE" value="2000000" /> 
      <input type="file" name="file_upload" id="file_upload" /> 
     <br /> 
     <input type="submit" name="upload" value="Upload" /> 
     </form> 
     '); 
$wgOut->addHtml(' Maximum upload size: 2M <br />'); 
$wgOut->addHtml('Permitted file types: png,gif,jpg,jpeg.'); 

} 

はjqueryの：

$("#uploadImage") 
            .dialog({ 
            autoOpen:false, 
            title: "Upload Image", 
            height: "auto", 
            width: 300 
            }); 

           $("#uploadImage").dialog("open"); 

            }; 

と

$wgOut->addHTML('<div id="uploadImage" style="display:none">'); 
    $form = self::uploadImage(); 
    $wgOut->addHtml($form); 
    $wgOut->addHTML('</div>'); 

Answer 1

あなたはjqueryのポストを使用してファイルをアップロードすることはできません。 ajaxfileupload のような別のプラグインを使用することができます。これはDOM内にtempory IFrameを作成し、そのIFrameをリフレッシュするだけでファイルのアップロードを行います。
HTML5 file uploadingを使用すると、browser supportを見る必要があります。
それ以外の場合はflash file uploadersを使用できます。

Answer 2

今、2013年。 You Canファイルをajaxでアップロードする しかし、ajaxFormプラグインを追加する必要があります。 それを検索してください！ Googleで