1

細かいアップローダーを実装していて、ファイルをアップロードできる場合。また、許可された拡張子を PDF のみを許可するように設定しました。

しかし、たとえば jpg をアップロードしようとすると、何も起こりません。

通常、これは問題ではありませんが、メッセージを確認したいと思います。これは Fineuploader Web サイトでは機能しますが、私には機能しません。

誰かが私を助けてくれることを願っています。

コード:

createUpload({ button: $('#dienstverleningsDocumentUploader'), 
endpoint:'/adviseur/profile/dienstverleningsDocument/' + '@Model.Adviseur.ServiceDocumentID',
messages: $('#dienstverleningsDocumentMessage'), allowedExtensions: ['pdf'] });

function createUpload(options) {
var button = options.button[0];//Should be a jQuery $(...)
var endpoint = options.endpoint;
var allowedExtensions = options.allowedExtensions || ['doc', 'xls', 'docx', 'xlsx', 'pdf'];
var sizeLimit = options.sizeLimit || 10000000;// 10Mb
var itemLimit = options.itemLimit || 10;
var messages = options.messages || $('#messages');
var complete = options.complete;

return new qq.FineUploaderBasic({
    button: button,
    request: {
        endpoint: endpoint
    },
    validation: {
        allowedExtensions: allowedExtensions,
        sizeLimit: sizeLimit,
        itemLimit: itemLimit
    },
    callbacks: {
        onSubmit: function (id, fileName) {
            messages.html('<div id="file-' + id + '" class="alert" style="margin: 20px 0 0"></div>');
        },
        onUpload: function (id, fileName) {
            $('#file-' + id).addClass('alert-info')
                            .html('<img src="client/loading.gif" alt="Initializing. Please hold."> ' +
                                  'Initializing ' +
                                  '“' + fileName + '”');
        },
        onProgress: function (id, fileName, loaded, total) {
            if (loaded < total) {
                progress = Math.round(loaded / total * 100) + '% of ' + Math.round(total / 1024) + ' kB';
                $('#file-' + id).removeClass('alert-info')
                                .html('<img src="client/loading.gif" alt="In progress. Please hold."> ' +
                                      'Uploading ' +
                                      '“' + fileName + '” ' +
                                      progress);
            } else {
                $('#file-' + id).addClass('alert-info')
                                .html('<img src="client/loading.gif" alt="Saving. Please hold."> ' +
                                      'Saving ' +
                                      '“' + fileName + '”');
            }
        },
        onComplete: function (id, fileName, responseJSON) {
            if (responseJSON.success) {
                $('#file-' + id).removeClass('alert-info')
                                .addClass('alert-success')
                                .html('<i class="icon-ok"></i> ' +
                                      '“' + fileName + '”' +
                                      'succesvol.'
                                      );
                if (complete) {
                    complete(fileName, responseJSON);
                }
            } else {
                $('#file-' + id).removeClass('alert-info')
                                .addClass('alert-error')
                                .html('<i class="icon-exclamation-sign"></i> ' +
                                      'Uploaden mislukt bij: ' +
                                      '“' + fileName + '”: ' +
                                      responseJSON.error);
            }
        }
    }
});
}
4

1 に答える 1

0

ホームページとドキュメントには、Fine Uploader Basic モードが UI 要素をまったく提供しないことが明確に記載されています。Fine Uploader Basic モードを使用している場合は、独自の UI を構築し、Fine Uploader の API とコールバックを利用することを想定しています。検証エラーなどのすべてのエラー メッセージは、onErrorコールバックに送信されます。独自のonErrorコールバック ハンドラを提供して、エラー メッセージを自分で表示できます。

たとえば、アプリでbootbox.jsを使用しているとします。インスタンスは次のようになります。

$('#uploaderContainer').fineUploader({
    uploaderType: 'basic',
    button: $('#dienstverleningsDocumentUploader'),
    request: {
     endpoint: '/adviseur/profile/dienstverleningsDocument/' + '@Model.Adviseur.ServiceDocumentID',    
    },
    validation: {
        allowedExtensions: ['pdf'],
        sizeLimit: 10000000,
        itemLimit: 10
    } 
})
    .on('error', function(event, id, fileName, reason, maybeXhr) {
        bootbox.alert(reason);
    });

この例では、jQuery Fine Uploader プラグインを使用していることに注意してください。プロジェクトですでにjQueryを使用しているので、あなたもそうすべきです。このプラグインの詳細については、ドキュメントを参照してください。

Fine Uploader に付属しているデフォルトの UI を使用し、それを少しカスタマイズする場合は、FineUploaderモードを使用する必要があります。これについては、ドキュメントでも詳しく説明されています。

于 2013-07-25T14:18:07.230 に答える