<tr>
  <th colspan="2" rowspan="999">
      写真画像
      <div>
          ドラッグ&amp;ドロップで並べ替えができます
      </div>
      自社HP：10点まで
  </th>
  <td class="p-regist__table-notp" colspan="6">
    <div class="p-imgupload-large">
      <div id="{{$id}}" class="p-imgupload-large__area">
          <p class="p-imgupload-large__text">画像をまとめてアップロード</p>
          <p class="p-imgupload-large__text-sub">ここに写真画像をドラッグ&amp;ドロップ</p>
      </div>
      <div id="imagebox2">
      </div>
    </div>
  </td>
</tr>

<script>
function dragover_large(e) {
    e.preventDefault();
}

function drop_large(e) {
  e.preventDefault();
  files = e.dataTransfer.files;

  for (var i=0; i<files.length; i++) {
    if (!files[i] || files[i].type.indexOf('image/') < 0) {
      continue;
    }
    var fileReader = new FileReader();
    var loadedImageUri = "";
    fileReader.onload = function( event ) {
      loadedImageUri = event.target.result;
    };
    fileReader.readAsDataURL( files[i] );

    $.get("/admin/addparts", function(data){
      data = data.replace("<div class=\"p-imgupload-large__imgarea\">", "<div class=\"p-imgupload-large__imgarea\"><img src='"+loadedImageUri+"'>");

      // $("<div><img src='"+loadedImageUri+"'></div>").appendTo("#{{$id}}");
      // $("#{{$id}} p").hide();

      $("#image_list").append(data);
    });
  }
}

function dragover(e) {
    e.preventDefault();
}

function drop(e) {
  e.preventDefault();
  files = e.dataTransfer.files;
  if(files.length > 1) {
    alert("アップロードできる画像は１枚です。");
    return;
  }
  for (var i=0; i<files.length; i++) {
    if (!files[i] || files[i].type.indexOf('image/') < 0) {
      continue;
    }
    
    $("[id^=iamgeAreaSingle] div").remove();
    var fileReader = new FileReader();
    fileReader.onload = function( event ) {
      var loadedImageUri = event.target.result;
      $("<div><img src='"+loadedImageUri+"'></div>").appendTo("[id^=iamgeAreaSingle]");
      $("[id^=iamgeAreaSingle] p").hide();
    };
    fileReader.readAsDataURL( files[i] );
  }
  $("#prevbox").after('<button type="button" class="btn btn-success" id="btn" onclick="Upload()">Upload</button>');
}

</script>