我正在尝试将新排序的有序数组发送到我的ajax文件中。
我正在使用 JQUERY UI 对排序后的顺序进行排序我希望将排序的数组放入 auction.ajax.php 文件中。
你可以看到我也试图准备一个数组。我需要将重新排序的文件名数组发送到ajax页面。
<script>
$(document).ready(function(e) {
var imageNames = [];
$(function() {
$("#myDrop").sortable({
items: '.dz-preview',
cursor: 'move',
opacity: 0.5,
containment: '#myDrop',
distance: 20,
tolerance: 'pointer',
});
$("#myDrop").disableSelection();
});
//Dropzone script
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#myDrop", {
paramName: "files", // The name that will be used to transfer the file
addRemoveLinks: true,
uploadMultiple: true,
autoProcessQueue: false,
parallelUploads: 50,
maxFilesize: 2, // MB
acceptedFiles: ".png, .jpeg, .jpg, .gif",
url: "ajax/actions.ajax.php",
});
/*Ans code*/
myDropzone.on("sending", function(file, xhr, formData) {
var filenames = [];
$('.dz-preview .dz-filename').each(function() {
filenames.push($(this).find('span').text());
});
formData.append('filenames', filenames);
});
/* Add Files Script*/
myDropzone.on("success", function(file, message) {
$("#msg").html(message);
//setTimeout(function(){window.location.href="index.php"},800);
});
myDropzone.on("error", function(data) {
$("#msg").html('<div class="alert alert-danger">There is some thing wrong, Please try again!</div>');
});
myDropzone.on("complete", function(file) {
//myDropzone.removeFile(file);
});
$("#add_file").on("click", function() {
myDropzone.processQueue();
});
});
</script>
<div class="dropzone dz-clickable" id="myDrop">
<div class="dz-default dz-message" data-dz-message="">
<span>Drop files here to upload</span>
</div>
</div>
<input type="text" name="sortingOrder" id="sortingOrder" value="">
<button id="add_file">Add</button>
答案 0 :(得分:1)
执行此操作的一种方法是使用sending
事件。此事件接收formData
作为参数,因此您可以对其进行修改,然后将数据发送到服务器。
myDropzone.on("sending", function(file, xhr, formData) {
var filenames = [];
$('.dz-preview .dz-filename').each(function() {
filenames.push($(this).find('span').text());
});
formData.append('filenames', filenames);
});
现在每个调用都包含一个参数filenames
,并且将包含dropzone中所有文件的已排序名称。
请参阅此working plunker。虽然没有应用样式,但是当您单击添加按钮时,您可以在控制台中看到文件的名称。