多个表单上传数据相互混合

Question

我创建了一个图片网站。我希望用户能够上传带有标题的图像。

var fileCollection = new Array();

$('#images').on('change', function(e) {
  var files = e.target.files;
  $.each(files, function(i, file) {
    fileCollection.push(file);
    var reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function(e) {
      var template = '<form class="upload_form col-md-6 col-xs-12" action="/upload">' +
        '<img class="col-md-4 col-xs-4" src="' + e.target.result + '"> ' +
        '<input style="width:90px; height:28px" class="col-md-2 col-xs-4"  type="number" name="table" id="table" >' +
        '<button style="margin:0px 5px 0px 5px; width:95px" class="btn btn-sm btn-primary col-md-3 col-xs-3 submit_form" value="Upload" name="submit_weight">Upload</button>' +
        '<button type="button" class="btn btn-sm btn-danger remove_form col-md-2 col-xs-6">Cancel</button>' +
        '<div style="height: 30px; font-size: 20px; margin: 0px 0px 10px 0px; padding: 0px; text-align: center;" class="progress col-md-7 col-xs-6 progress-stripped active"><div class="progress-bar" style="font-size: 15px; width:0%"></div></div> ' +
        '</form>';

      $('#images-to-upload').append(template);
    };
  });
});

$(document).on('submit', 'form', function(e) {    			
  e.preventDefault();
  var index = $(this).index();
  var formdata = new FormData($(this)[0]);
  $form = $(this);
  formdata.append('images', fileCollection[index]);
  var request = new XMLHttpRequest();
		
  // progress complete load event
  request.open('post', 'script/file_upload_admin.php', true);
  request.send(formdata);
});

$("#upload_button").on('click', function(event) {
  event.preventDefault();
  $(".submit_form").click();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <h1>Image Uploader</h1>
  <input type="file" name="images[]" id="images" multiple>
  <div id="images-to-upload" class="row"></div>
    <div class="col-md-12">
      <button id="upload_button" class="btn btn-sm btn-success col-md-4 col-xs-12">Upload all images</button>
    </div>
  </div>

当用户上传多个图像时，标题会相互混淆。例如，image_1标题设置在image_2上，反之亦然。有什么方法可以循环表单，以便逐个上传吗？