Настройка AJAX File Uploader с помощью AJAX Upload - PullRequest
Новая
       2

Настройка AJAX File Uploader с помощью AJAX Upload

0 голосов
/ 13 января 2012

Я пытаюсь использовать http://valums.com/ajax-upload/ для загрузки файлов через AJAX. Причина в том, что он отвечает моим потребностям. Тем не менее, мне нужно настроить поведение, и я не могу понять это. Согласно документации, я должен иметь возможность использовать FileUploaderBasic, но я даже не могу получить кнопку загрузки для отображения с FileUploaderBasic. В настоящее время я пробую следующее: 

<div id="file-uploader">                
    <noscript>                      
        <p>Please enable JavaScript to use file uploader.</p>           
    </noscript>             
</div>
<div id="progressbar" style="width:300px;"></div>

<script type="text/javascript">
    $().ready(function () {
        var u = new uploader.FileUploaderBasic({
            element: document.getElementById('file-uploader'),
            action: '/files/upload',
            debug: true,
            onProgress: function (id, fileName, loaded, total) {
                $("#progressbar").progressbar("value", 50);
            },
            onComplete: function(id, fileName, responseJSON){
                $("#progressbar").progressbar("value", 100);            
            },
        });

        $("#progressbar").progressbar({
            value: 0
        });
    });
</script>

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

<table border='0' cellpadding='0' cellspacing='0'>
  <tr><td rowspan='2'>[img]</td>
    <td>[Progress Bar]</td>
    <td>[%]</td>
  </tr>

  <tr><td colspan='2'>[filename] - [filesize]</td></tr>
</table>

Я просто не уверен, как это сделать с помощью FileUploaderBasic. Что я делаю неправильно? Я достиг отчаяния. Пожалуйста, помогите!

1 Ответ

1 голос
/ 12 апреля 2012

попробуйте изменить

element: document.getElementById('file-uploader')

до

button: document.getElementById('file-uploader')

...