2017-07-18 36 views
0

我想發送新的排序有序數組到我的ajax文件。Dropzone排序數組發送到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

我沒有看到問題描述。你面臨什麼問題? – Rei

+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,並且將包含有沒有在懸浮窗中的所有文件的排序的名字。

請參閱此working plunker。雖然沒有應用樣式,但單擊「」時添加按鈕時,您可以在控制檯中看到文件的名稱。

+0

你能更新上面的代碼嗎? –

+0

@ZaidBinKhalid - 您只需將我的代碼附加到您的代碼中,它只是您的dropzone組件的另一個回調函數。您現在不需要用'sortable'的'stop'功能編寫的代碼。 – 31piy

+0

我仍然無法獲得重新排序的數組。 :( –