克隆現有的blueimp文件上傳表

Question

我在當前項目中使用blueimp jquery文件上傳。

我想克隆我現有的文件上傳表。在新克隆上，我應該可以進行更改，並且這些更改不會影響第一個表。

表單可能包含一些上傳到瀏覽器但未發送到服務器的文件。

由於在這個問題How to I preload existing files and display them in the blueimp upload table? demonstated我可以創建一個新的形式，並添加已上傳到服務器的照片如下：

$(this).fileupload('option', 'done').call(this, null, {result: result}); 

但在我的情況下，這些照片不會被髮送到服務器，但在舉行現有的表格/表格。

注意：我將在我的編輯視圖中使用該克隆。編輯視圖有一個取消按鈕。如果用戶按取消，我希望能夠恢復到原始狀態。

Answer 1

使用插件我能夠證明在新表上表中的文件和fileInputs的「綱領性文件上傳」功能如下：

$('#fileupload').fileupload('add', { 
    files: filesList, 
    fileInput: $(this) 
}); 

https://github.com/blueimp/jQuery-File-Upload/wiki/API#programmatic-file-upload https://github.com/blueimp/jQuery-File-Upload/wiki/API#programmatic-file-uploads-for-browsers-without-support-for-xhr-file-uploads

注意我能通過使用插件的「fileuploadadded」事件從previos表中收集文件和fileInput

$('#fileupload').bind('fileuploadadded', function (e, data) {/* ... */}); 

https://github.com/blueimp/jQuery-File-Upload/wiki/Options#additional-callback-options-for-the-ui-version

Answer 2

我們可能需要更多的信息或更多的代碼才能真正幫助，但我的印象是，您只是試圖創建第二個爲用戶添加功能的html表。用戶可以進行更改，如果按下「確認」按鈕，則編輯將應用於原始表格。如果是這種情況，那麼blueimp框架，或者甚至文件可能最終上傳到服務器的事實，都不應該被視爲這個UI場景的因素。

jquery有一個方法clone，它可以讓你複製一個表並將它附加到你想要的DOM。然而，這張新表具有新功能的事實讓我覺得簡單的克隆不是你想要的。預先製作另一個「編輯表」，並預設其所有功能並隱藏默認情況下可能會更好。然後，當用戶想要編輯某個特定項目時，您需要更新'編輯表'並提供必要的數據，然後使用show。如果用戶點擊'取消'，只需隱藏編輯表，如果用戶點擊'確認'隱藏編輯表並將編輯保存到該項的js對象，則更新原始表以匹配編輯。

我的答案缺乏任何代碼示例，因爲此最終產品的實際代碼可能因項目而異。如果您想在jsFiddle上整理項目的簡化版本，可能會對其他人有所幫助。