jquery-file-upload - jQuery-File-Upload を使用して 1 ページに複数のフォーム

Question

さまざまな種類のドキュメントを関連付ける複数のフォームを追加しようとしていますが、2 番目のフォームからファイルを追加しようとすると、プライマリ フォームの送信とプロセス イベントに表示されます。ここで何が間違っているのか教えてください。

<form accept-charset="UTF-8" action="/docs/1" class="documents" enctype="multipart/form-data" id="new_document" method="post">
  <div class="input-append" >
    <input class="filestyle" did="pdoc" id="document_doc_file" name="document[doc_file]" type="file" uid="template-upload-1" />
  </div>
  <input id="document_doc_type" name="document[doc_type]" type="hidden" value="1" />
</form><script id="template-upload-1" type="text/x-tmpl">
  <div class="upload">
    {%=o.name%}<span class="pull-right" id="pbar">Uploading 0%</span></span>
    <div class="progress"><div class="bar" style="width: 0%"></div></div>
  </div>
</script>
<div id="pdoc"></div>


<form accept-charset="UTF-8" action="/docs/1" class="documents" enctype="multipart/form-data" id="new_document" method="post">
  <div class="input-append" >
    <input class="filestyle" did="ldoc" id="document_doc_file" name="document[doc_file]" type="file" uid="template-upload-2" />
  </div>
  <input id="document_doc_type" name="document[doc_type]" type="hidden" value="2" />
</form><script id="template-upload-2" type="text/x-tmpl">
  <div class="upload">
    {%=o.name%}<span class="pull-right" id="pbar">Uploading 0%</span></span>
    <div class="progress"><div class="bar" style="width: 0%"></div></div>
  </div>
</script>
<div id="ldoc"></div>

<script type="text/javascript">
    $(function () {
      $('.documents').fileupload({
        dropZone: $(this).find('input:file'),
        dataType: 'script',
        fileInput: $(this).find('input:file'),
        singleFileUploads: true,
        add: function(e, data) {
          var file, types;
          types = /(\.|\/)(pdf|xls|xlsx)$/i;
          file = data.files[0];
          if (types.test(file.type) || types.test(file.name)) {
            uid = $(this).find(':file').attr('uid');
            if ($('#' +uid).length > 0) {
              data.context = $(tmpl(uid, file).trim());
            }
            did = $(this).find(':file').attr('did');
            $('#' + did).append(data.context);
            data.submit();
          } else {
            alert("" + file.name + " is not a pdf or an excel file.");
          }
        },
        progress: function (e, data) {
          if (data.context) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            data.context.find('.bar').css('width', progress + '%');
            if (progress < 100) {
              data.context.find('#pbar').html('Uploading ' + progress + '% ...');
            } else {
              data.context.find('#pbar').html('Upload Complete');
            }
          }
        }
      });
    $(document).bind('drop dragover', function (e) {
      e.preventDefault();
    });
  });
</script>