表单提交上的plupload队列检查文件有问题

时间:2012-11-25 23:16:52

标签: plupload

我在触发uploader.start()时遇到问题,如果没有单击启动按钮进行文件上传,我使用的是最新版本的Plupload。这里是完整的代码,我想找到为提交点击上传的每个文件给出的临时名称,这样我就可以转到服务器并使用引用ID重命名文件,这样可以很容易地识别属于的文件。 / p>

     <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>

1 个答案:

答案 0 :(得分:2)

首先,您应该在$(document).ready中移动提交绑定,以确保DOM已准备好进行提交绑定。

我猜你应该尝试依赖一个闭包来确保在StateChanged中正确绑定“uploader”(你也可以用var uploader = $(“#Testloader”)开始你的StateChanged Handler .pluploadQueue();):

  $('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;
  });

希望这会有所帮助