So, I tried following the solution here:
Dropzone image upload options not working 🙁
but, whenever I provide the option:
JavaScript
x
2
1
Dropzone.autoDiscover = false;
2
the dropzone goes from displaying the default drag’n’drop look to just text with a “Browse” button.
Here is my code (dropzone is included in header):
JavaScript
1
25
25
1
<script type="text/javascript">
2
$(document).ready(function () {
3
Dropzone.autoDiscover = false;
4
$("#uploadme").dropzone({
5
maxFilesize: 5000,
6
dictDefaultMessage: "Drop your file here to upload (multiple files require being zipped)",
7
uploadMultiple: false,
8
addRemoveLinks: true
9
});
10
});
11
</script>
12
13
<h5>Test space for FTP</h5>
14
<asp:Label ID="lblError" runat="server"></asp:Label>
15
<div class="mainContent">
16
<form runat="server" method="post" enctype="multipart/form-data"
17
class="dropzone"
18
id="ftpUpload">
19
<div class="fallback" id="uploadme">
20
<input type="file" name="file" multiple />
21
<input type="submit" value="Upload" />
22
</div>
23
</form>
24
</div>
25
So, the question is, how do I specify options for dropzone without ruining the default look?
Advertisement
Answer
I figured it out myself. I’m fairly new to ASP.NET Web Forms and forgot that Javascript is client-side and therefore references element IDs which are different on the client-side than server-side. I viewed the source and found that the form’s ID is “aspnetForm”, so I changed my options code to:
JavaScript
1
5
1
Dropzone.options.aspnetForm = {
2
uploadMultiple: false,
3
maxFiles: 1,
4
maxFilesize: 5000,
5
etc.
Now it works!