Плагин загрузки файла jQuery не работает

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

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

После некоторых исследований я обнаружил, что метод _renderUpload jquery.fileupload-jquery-ui.js никогда не вызывается. Также не создавайте метод _create того же файла. Этим методом является ответственность за добавление классов CSS, чтобы загрузка файлов выглядела лучше.

Это код HTML, который у меня есть:

<div class="fileupload-buttonbar">
    <div class="fileupload-buttons">
        <span class="fileinput-button">
            <span>Agregar archivo...</span>
            <input type="file" name="files[]">
        </span>
        <button type="submit" class="start">Importar</button>
    </div>
    <div class="fileupload-progress fade" style="display:none">
        <!-- The global progress bar -->
        <div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div>
        <!-- The extended global progress information -->
        <div class="progress-extended">&nbsp;</div>
    </div>
</div>              
<table role="presentation"><tbody class="files"></tbody></table>

И это инициализация:

$(function () {
            $('#fileupload').fileupload({
                url: '@Url.Action("Import")',
                disableImageResize: false,
                maxFileSize: 30000,
                acceptFileTypes: /(\.|\/)(csv|txt|xls|xlsx)$/i,
                singleFileUploads: true,
                autoUpload: false,
                maxNumberOfFiles: 1,
                change: function (e, data) {
                    alert(data.files.length);
                    $.each(data.files, function (index, file) {
                        $('#import_file').text(file.name);
                        $('button#import').attr('style', 'display: ');
                        $('span#status').text('');
                    });
                },
                add: function (e, data) {
                    alert(data.files);
                    data.context = $('button#import')
                        .click(function () {
                            data.context = $('span#status').text('Importando...');
                            $('button#import').attr('style', 'display: none');
                            data.submit();
                        });
                },
                done: function (e, data) {
                    data.context.text('Completo.');
                    $("#administradores").trigger("reloadGrid", [{ page: 1 }]);
                }
            });

                $('#fileupload').addClass('fileupload-processing');
}

И, наконец, я сказал, что включаю следующий CSS файл: jquery.fileupload-ui.css

И это JS файлы в следующем порядке:

• jquery.ui.widget.js
• jquery.iframe-transport.js
• jquery.fileupload.js
• jquery.fileupload-process.js
• jquery.fileupload-validate.js
• jquery.fileupload-ui.js
• jquery.fileupload-JQuery-ui.js

Любая помощь будет принята с благодарностью

Спасибо Хайме

Ответы

Ответ 1

У меня неверный div id. Это была проблема.

С уважением, Хайме