web-dev-qa-db-ja.com

jQuery FileUploadプラグインを使用してアップロードする前にアップロードファイル名を取得する

JQueryファイルアップロードプラグインを使用しています https://github.com/blueimp/jQuery-File-Upload/wiki 複数のファイルをサーバーにアップロードします。アップロードした画像をサーバーに保存するカスタムWebサービスで使用します。ただし、POSTリクエスト本文に加えて、アップロードするファイルの名前もWebサービスに渡す必要があります。したがって、ファイル転送のたびに、次のことも行う必要があります。ファイルの名前をWebサービスに渡します。ファイル名を取得してアップロードリクエストごとに送信する方法を教えてもらえますか?基本的に、追加の入力フィールドなしでフィールドから取得する必要があります。ユーザーが10個のファイルを選択した場合、キュー内の各ファイルの名前を取得して、アップロードリクエストとともに送信する必要があります。

ありがとう。

6
cycero

わかりました、これが機能するソリューションです:

// Storing the file name in the queue
var fileName = "";

// On file add assigning the name of that file to the variable to pass to the web service
$('#fileupload').bind('fileuploadadd', function (e, data) {
  $.each(data.files, function (index, file) {
    fileName = file.name;
  });
});

// On file upload submit - assigning the file name value to the form data
$('#fileupload').bind('fileuploadsubmit', function (e, data) {
  data.formData = {"file" : fileName};
});
12
cycero
var filename = $('input[type=file]').val().split('\\').pop();
2
manish nautiyal

あなたのサイトがどのようなウェブサービスを使用していたのかわかりません。履歴書はashxです。使用できる場合は

HttpPostedFile file = context.Request.Files["Filedata"];

ファイル名を取得します。

またはjqueryを使用します

$("#yourid").uploadify({
.....
    'onSelect': function(e, queueId, fileObj)
    {
        alert( "FileName:" + fileObj.name);
    }
});

// jquery-file-upload

$('#fileupload').fileupload({
drop: function (e, data) {
    $.each(data.files, function (index, file) {
        alert('Dropped file: ' + file.name);
    });
},
change: function (e, data) {
    $.each(data.files, function (index, file) {
        alert('Selected file: ' + file.name);
    });
}

});

1
TechStone