Клонирование существующей таблицы загрузки файлов blueimp

Я использую загрузку файла blueimp jquery в своем текущем проекте.

Я хочу сделать клон моей существующей таблицы загрузки файлов. В новом клоне я должен иметь возможность вносить изменения, и эти изменения не повлияют на первую таблицу.

Форма может содержать некоторые файлы, загруженные в браузер, но не отправленные на сервер.

Как показано в этом вопросе Как предварительно загрузить существующие файлы и отобразить их в таблице загрузки blueimp? Я могу создать новую форму и добавить фотографии, загружаемые на сервер, следующим образом:

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

Но в моем случае фотографии не отправляются на сервер, а хранятся в существующей форме/таблице.

Примечание. Я буду использовать клон в своем режиме редактирования. В окне редактирования есть кнопка отмены. Я хочу иметь возможность вернуться в исходное состояние, если пользователь нажмет кнопку отмены.


javascript jquery jquery-file-upload blueimp
person nilgun    schedule 25.10.2013    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Используя функцию «Программная загрузка файлов» плагина, я смог отобразить файлы предыдущей таблицы и файловые вводы в новой таблице следующим образом:

$('#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-безподдержкизагрузкифайловxhr

Примечание. Мне удалось собрать файлы и fileInputs из таблицы previos с помощью события «fileuploadadded» плагина.

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

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

person nilgun    schedule 30.10.2013

arrow_upward
1
arrow_downward

Нам может понадобиться больше информации или больше кода, чтобы действительно помочь, но у меня сложилось впечатление, что вы просто пытаетесь создать вторую таблицу html, которая добавила функциональность для пользователя. Пользователь может вносить изменения, и если нажать кнопку «Подтвердить», изменения будут применены к исходной таблице. Если это так, то инфраструктура blueimp или даже тот факт, что файлы могут или не могут быть в конечном итоге загружены на сервер, не должны рассматриваться как факторы для этого сценария пользовательского интерфейса.

В Jquery есть метод clone, который позволит вам продублировать таблицу и добавить ее в DOM, где вы желание. Однако тот факт, что эта новая таблица будет иметь новую функциональность, заставляет меня думать, что простой клон - это не то, что вам нужно. Возможно, было бы лучше иметь еще одну предварительно созданную «таблицу редактирования» со всеми ее функциями и скрытую по умолчанию. Затем, когда пользователь захочет отредактировать определенный элемент, вы обновите «таблицу редактирования» необходимыми данными и show< /а> это. Если пользователь нажимает «Отмена», просто скрывает таблицу редактирования, если пользователь нажимает «Подтвердить», скрывает таблицу редактирования и сохраняет изменения в объекте js для этого элемента, а затем обновляет исходную таблицу в соответствии с изменениями.

В моем ответе намеренно отсутствуют какие-либо примеры кода, поскольку фактический код для этого конечного продукта может сильно различаться в зависимости от проекта. Если вы хотите собрать упрощенную версию своего проекта на jsFiddle, это может помочь другим.

person Matt R. Wilson    schedule 27.10.2013
comment
Привет Мэтт, спасибо за ваш ответ. У меня то же самое, но я не знаю, как обновить «таблицу редактирования» необходимыми данными и показать ее с помощью плагина bluimp. Я не знаю, как воссоздать пользовательский интерфейс ( blueimp.github.io/jQuery-File-Upload ) с файлами data.files и data.fileInput, собранными из предыдущих таблиц. - person nilgun; 28.10.2013
comment
nilgundag, это будет полностью зависеть от функциональности, которую вы пытаетесь создать, которую вы никогда не указывали, кстати. Вы на правильном пути, используя встроенные обратные вызовы от blueimp, которые позволят вам сохранять ссылки на файловые объекты в вашем домене кода. Однако, как указано выше, это можно сделать дюжиной различных способов, и без дополнительной информации/примеров трудно дать вам больше. Имейте в виду, что blueimp — это просто js-фреймворк, а не волшебство. Я всегда рекомендую читать кодовую базу фреймворка, когда застреваю. - person Matt R. Wilson; 28.10.2013