3

ファイルのアップロードのために開始ボタンがクリックされていない場合に備えて、uploader.start() の起動に問題があり、最新バージョンの Plupload を使用しています。ここに完全なコードがあります。送信クリックでアップロードされた各ファイルに付けられた一時名を見つけて、サーバーに移動し、ファイルを簡単に識別できる参照 ID でファイルの名前を変更できるようにします。

     <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <link href="Styles/jquery.plupload.queue.css" rel="stylesheet" type="text/css" />
    <script src="Script/jquery-1.8.2.js" type="text/javascript"></script>
    <script src="Script/FileUpload/plupload.full.js" type="text/javascript"></script>
    <script src="Script/FileUpload/jquery.plupload.queue.js" type="text/javascript"></script>
    <title>Test Page</title>
    <script type="text/javascript">
        $(document).ready(function () { 
          $("#Testloader").pluploadQueue({
              runtimes: 'flash',
              url: 'FileUpload.ashx',
              max_file_size: '100mb',
              urlstream_upload: true,
              chunk_size: '5MB',
              //unique_names: false,
              multiple_queues: true,

              filters: [
            { title: "Document files", extensions: "pdf,doc,docx,tiff" },
            { title: "Image files", extensions: "jpg,png" }
        ],
              // Flash settings
              flash_swf_url: 'Images/plupload.flash.swf',

              //                    // Silverlight settings
              //                    silverlight_xap_url: 'assets/resources/plupload.silverlight.xap',

              init: {
                  FileUploaded: function (up, file, info) {
                  },                 
                  FilesRemoved: function (up, files) {
                      plupload.each(files, function (file) {

                      });
                  }
              }

          });
      });
      $('form').submit(function (e) {
          alert("clicked me");
          var uploader = $("#Testloader").pluploadQueue();
          // Files in queue upload them first
          if (uploader.files.length > 0) {
              // When all files are uploaded submit form
              uploader.bind('StateChanged', function () {
                  if (uploader.files.length === (uploader.total.uploaded + uploader.total.failed)) {
                      // $('form')[0].submit();
                      alert("Form submitted");
                  }
              });
              uploader.start();

          } else {

              alert('You must queue at least one file.');

          }
          return false;
      });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="Testloader">      
    </div>
   <input type="submit" value="send" />
    </form>
</body>
</html>
4

1 に答える 1

2

まず、提出バインディングを $(document).ready 内に移動して、DOM が提出バインディングの準備ができていることを確認する必要があります。

StateChanged 中に「アップローダー」が正しくバインドされるように、クロージャーに依存する必要があると思います ( var uploader = $("#Testloader").pluploadQueue();) で StateChanged Handler を開始することもできます。

  $('form').submit(function (e) {
      alert("clicked me");
      var uploader = $("#Testloader").pluploadQueue();
      // Files in queue upload them first
      if (uploader.files.length > 0) {
          // When all files are uploaded submit form
          uploader.bind('StateChanged', (function(closedUploader){return function () {
              if (closedUploader.files.length === (closedUploader.total.uploaded + closedUploader.total.failed)) {
                  // $('form')[0].submit();
                  alert("Form submitted");
              }
          };})(uploader)
          );
          uploader.start();

      } else {

          alert('You must queue at least one file.');

      }
      return false;
  });

これが役立つことを願っています

于 2012-11-27T13:00:21.840 に答える