2014-01-22 2 views
0

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

Я действительно не хочу создавать свой собственный пользовательский интерфейс только для этой цели.

ответ

1

Вы можете добавить пользовательские элементы в шаблон Fine Uploader, и эти элементы будут отображаться в DOM, который вы можете, чем манипулировать с помощью JavaScript.

<script type="text/template" id="qq-template"> 
    <div class="qq-uploader-selector qq-uploader"> 
     ... 
     <ul class="qq-upload-list-selector qq-upload-list"> 
      <li> 
       ... 
       <!-- custom element for updating with progress --> 
       <span class="file-progress"></span> 
      </li> 
     </ul> 
    ... 
    </div> 
</script> 

Вы бы тогда, чтобы связать в события Fine добавивший его обновить этот элемент, когда файл передается (onSubmitted) или прогрессирует (onProgress). Для этого вы должны использовать метод API getItemByFileId для выбора элемента списка файлов в DOM, а затем использовать JS для выбора этого дочернего элемента, содержащего элемент прогресса, который вы хотите обновить, и, естественно, обновить его, как вы бы.

// ... 

onSubmitted: function (id, name) { 
    var el = getElementByFileId(id) // retrieves the list element for this file id. 
    // initialze the progress element, with 0% for example 
}, 

// ... 

onProgress: function (id, name, uploadedBytes, totalBytes) { 
    // update as the file progresses .... 
} 

// ... 

documentation имеет больше примеров о том, как легко добавлять пользовательские элементы в DOM.

+0

Идеально ... по какой-то причине я пропустил эту часть страницы стилизации ... Клянусь, я посмотрел ее сначала :-(Спасибо. – ezwrighter

+1

тоже хедз-ап, ваш пример html "" должен закрываться с пролетом, а не тегом привязки. – ezwrighter

Смежные вопросы