質問編集履歴
1
HTML, JavaScriptのソースコードを掲示
test
CHANGED
File without changes
|
test
CHANGED
@@ -37,3 +37,153 @@
|
|
37
37
|
|
38
38
|
|
39
39
|
宜しくお願い致します。
|
40
|
+
|
41
|
+
|
42
|
+
|
43
|
+
---
|
44
|
+
|
45
|
+
**追記**:関係していると思われる個所を掲示させていただきます。
|
46
|
+
|
47
|
+
|
48
|
+
|
49
|
+
```form
|
50
|
+
|
51
|
+
<form method="post" action="" id="form" class="files-container" style="background-color: rgb(248,248,248);text-align: center;" enctype="multipart/form-data">
|
52
|
+
|
53
|
+
<div class="form-group"><input class="form-control" type="text" name="title" placeholder="タイトル" style="margin-top: 8px;margin-bottom: 8px;" required=""></div>
|
54
|
+
|
55
|
+
<div class="form-group"><button id="dropzoneSubmit" class="btn btn-primary btn-block d-xl-flex justify-content-xl-center" style="font-size: 16px;margin-top: 64px;">公開する</button>
|
56
|
+
|
57
|
+
</div>
|
58
|
+
|
59
|
+
<input type="submit" value="" style="display:none" name="publish">
|
60
|
+
|
61
|
+
</form>
|
62
|
+
|
63
|
+
```
|
64
|
+
|
65
|
+
|
66
|
+
|
67
|
+
```javascript
|
68
|
+
|
69
|
+
<script type="text/javascript">
|
70
|
+
|
71
|
+
Dropzone.autoDiscover = false;
|
72
|
+
|
73
|
+
$(document).ready(function() {
|
74
|
+
|
75
|
+
var myDropzone = new Dropzone("#myDropzone", {
|
76
|
+
|
77
|
+
url: "",
|
78
|
+
|
79
|
+
paramName: "file",
|
80
|
+
|
81
|
+
autoProcessQueue: false,
|
82
|
+
|
83
|
+
uploadMultiple: true,
|
84
|
+
|
85
|
+
parallelUploads: 100,
|
86
|
+
|
87
|
+
maxFilesize: 3,
|
88
|
+
|
89
|
+
maxFiles: 10,
|
90
|
+
|
91
|
+
acceptedFiles: ".jpg, .jpeg, .png, .gif",
|
92
|
+
|
93
|
+
addRemoveLinks: true,
|
94
|
+
|
95
|
+
dictFileTooBig: "この画像のサイズは{{filesize}}MBです. 最大サイズは{{maxFilesize}}MBです",
|
96
|
+
|
97
|
+
dictInvalidFileType: "対応している拡張子はJPG, JPEG, PNG, GIFのみです",
|
98
|
+
|
99
|
+
dictCancelUpload: "キャンセル",
|
100
|
+
|
101
|
+
dictRemoveFile: "削除",
|
102
|
+
|
103
|
+
dictMaxFilesExceeded: "アップロード可能な枚数は最大{{maxFiles}}枚です",
|
104
|
+
|
105
|
+
dictDefaultMessage: "画像を選択してください",
|
106
|
+
|
107
|
+
});
|
108
|
+
|
109
|
+
});
|
110
|
+
|
111
|
+
Dropzone.options.myDropzone = {
|
112
|
+
|
113
|
+
init: function() {
|
114
|
+
|
115
|
+
var pf = false;
|
116
|
+
|
117
|
+
var myDropzone = this;
|
118
|
+
|
119
|
+
$("#dropzoneSubmit").on("click", function(e) {
|
120
|
+
|
121
|
+
e.preventDefault();
|
122
|
+
|
123
|
+
e.stopPropagation();
|
124
|
+
|
125
|
+
|
126
|
+
|
127
|
+
if(pf){
|
128
|
+
|
129
|
+
$("input[name=publish]").click();
|
130
|
+
|
131
|
+
}
|
132
|
+
|
133
|
+
|
134
|
+
|
135
|
+
if (myDropzone.files != "") {
|
136
|
+
|
137
|
+
myDropzone.processQueue();
|
138
|
+
|
139
|
+
} else {
|
140
|
+
|
141
|
+
$("#myDropzone").submit();
|
142
|
+
|
143
|
+
}
|
144
|
+
|
145
|
+
});
|
146
|
+
|
147
|
+
// ファイル追加時
|
148
|
+
|
149
|
+
this.on("addedfile", function(file) {
|
150
|
+
|
151
|
+
// console.log(file);
|
152
|
+
|
153
|
+
});
|
154
|
+
|
155
|
+
// エラー時
|
156
|
+
|
157
|
+
this.on("error", function(file, response) {
|
158
|
+
|
159
|
+
// console.log(response);
|
160
|
+
|
161
|
+
});
|
162
|
+
|
163
|
+
// アップロード開始時
|
164
|
+
|
165
|
+
this.on("sendingmultiple", function(file) {
|
166
|
+
|
167
|
+
// console.log(file);
|
168
|
+
|
169
|
+
});
|
170
|
+
|
171
|
+
// アップロード成功時
|
172
|
+
|
173
|
+
this.on("successmultiple", function(file) {
|
174
|
+
|
175
|
+
// submit form
|
176
|
+
|
177
|
+
pf = true;
|
178
|
+
|
179
|
+
$("input[name=publish]").click();
|
180
|
+
|
181
|
+
});
|
182
|
+
|
183
|
+
}
|
184
|
+
|
185
|
+
};
|
186
|
+
|
187
|
+
</script>
|
188
|
+
|
189
|
+
```
|