i am creating a html-based website with Spring MVC. I have a upload function that works with the normal html input type=file. Now i wanted to have a drag & drop function and tried to use dropzone.js. I think that the problem is, that the dropzone doesn't pass the filepath to the html input type=file box. How can i achieve this? I want to use the dropzone only to get the filepath. The upload should still work with the form submition.
upload function in java:
@RequestMapping(value = "/upload", method = RequestMethod.POST)
public ModelAndView handleFormUpload(@RequestParam("name") String name,
@RequestParam("file1") MultipartFile file1, @RequestParam("file2") MultipartFile file2)
throws IOException, SerialException, SQLException {
if (!file1.isEmpty() || !file2.isEmpty()) {
byte[] bytes1 = file1.getBytes();
byte[] bytes2 = file2.getBytes();
patientenService.uploadPDF(createdId, bytes1, bytes2);
ModelAndView modelAndView = new ModelAndView("index");
return modelAndView;
}
ModelAndView modelAndView = new ModelAndView("uploadfailed");
return modelAndView;
}
dropzone in html-file:
<form class="dropzone" id="avatar-dropzone" method="post"
action="/upload" enctype="multipart/form-data">
<img id="dropzone-img" src="../image/01erstellen/arrow68.png" /> <input
id="inputname" type="text" name="name" /> <input id="inputfile1"
type="file" name="file1" /> <input id="inputfile2" type="file"
name="file2" /> <input id="btn-abschicken" type="submit"
value="Hochladen" />
</form>
dropzone javascript:
<script>
$(document).ready(function() {
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone($("#avatar-dropzone"), {url: "/file/post"});
Dropzone.options.myAwesomeDropzone = {
paramName: "file1", // The name that will be used to transfer the file
maxFilesize: 10, // MB
});
i hope that someone can help me, thank you!