AjaxFileUpload

訳者注：このプラグインはjQuery 1.5RCで削除された$.handleErrorを使用しているので、jQuery1.4.4以前でないと動作しない可能性がある。

AjaxFileUploadプラグインは、yvind Saltvikによって作られたAjaxuploadプラグインを元に作成した。
Its idea is to create a iframe and submit the specified form to it for further processing.

AjaxFileUploadでは、指定されたファイルタイプのinputのみではなく、フォーム全体を送信する。

使い方

1. jquery.jsとプラグインを読み込む
2. アップロードボタンが押された際の関数を作成する

function ajaxFileUpload(){
  //Ajaxが開始、終了した際のアニメーションを定義
  $("#loading")
  .ajaxStart(function(){
      $(this).show();
  })
  .ajaxComplete(function(){
      $(this).hide();
  });
 
  /*
      Ajaxファイルアップロードの準備
      url: ファイルをアップロードする先のスクリプトURL
      fileElementId: the file type of input element id and it will be the index of  $_FILES Array()
      dataType: jsonとxmlをサポート
      secureuri: セキュアプロトコルの使用
      success: Ajax成功時のコールバック関数
      error: Ajax失敗時のコールバック関数
     
          */
  $.ajaxFileUpload({
    url:'doajaxfileupload.php',
    secureuri:false,
    fileElementId:'fileToUpload',
    dataType: 'json',
    success: function (data, status)
    {
        if(typeof(data.error) != 'undefined')
        {
            if(data.error != '')
            {
                alert(data.error);
            }else
            {
                alert(data.msg);
            }
        }
    },
    error: function (data, status, e)
    {
        alert(e);
    }
  });
 
  return false;
}

動作デモ