jqueryファイルアップロードプラグイン - 選択したファイル名が表示されない

Question

jqueryファイルアップロードプラグイン（基本）を使用して、一度に1つのファイルをアップロードしています。プラグインは正常に動作し、正しいディレクトリにダンプされたファイルを見ることができます。ただし、ファイルを選択すると、選択したファイルの名前（Chrome）/パス（IE）が表示されず、[ファイルが選択されていません]と表示されます。選択したファイルの名前を表示するにはどのように変更できますか？私のコード：

スクリプト：

$(function() { 
      $('#fileupload').fileupload({ 
       dataType: 'json', 
       url: '@Url.Action("Index", "Home")', 
       add: function (e, data) { 
        data.submit(); 
       }, 
       progress: function (e, data) { 
        var progress = parseInt(data.loaded/data.total * 100, 10); 
        $('#progress .bar').css('width', progress + '%'); 

       }, 
       done: function (e, data) { 
        $('<p/>').text(data.files[0].name).appendTo(document.body);       
       } 
       //multipart: false 
      });    

     }); 

にHomeController：

[HttpPost] 
    public ActionResult Index(HttpPostedFileBase files) 
    {   
     return Json(files.FileName); 
    }  

インデックス：私が正しくあなたを理解する場合は、選択できるようにしたいとしている

<input id="fileupload" type="file" name="files"/> 
<div id="progress" style="width: 250px"> 
    <div class="bar" style="width: 0%;"></div> 
</div> 

Answer 1

ファイルアップロードの呼び出しに次の引数を渡す：

$('#fileupload').fileupload({ 

    formData:{extra:1}, 
    autoUpload: false, 
    url: "uploader.php", 
    replaceFileInput:false, 
    fileInput: $("input:file") 
}); 

replaceFileInput:falseは

Answer 2

あなたあなたの画面上に名前が表示されるようにしてください。このような場合は、次のように試してください：

HTML：

<!--Don't forget to wrap your form elements inside a form--> 
<input id="fileupload" type="file" name="files" /> 

<ul id="selected-files"> 
    <!--File names will be displayed here--> 
</ul> 

<div id="progress" style="width: 250px"> 
    <div class="bar" style="width: 0%;"></div> 
</div> 

あなたは（あなたが言ったことをオフに基づいて）作業スクリプトのほとんどを持っているように見えます。だから、私たちはいくつかのものを変更するだけです。まず、data.fileコマンドを（後で微調整して）add:関数に移動します...次に、いくつかの順序でファイル名を表示するためにいくつかのカスタムvarsを作成します（より簡単にスタイルを設定できるようになります） 。

スクリプト：

$(function() { 

    var ul = $('#selected-files'); 

    $('#fileupload').fileupload({ 
     dataType: 'json', 
     url: '@Url.Action("Index", "Home")', 

     add: function (e, data) { 
      var selectedFiles = $('<li class="file-name"><p></p></li>'); 
      selectedFiles.find('p').text(data.files[0].name); 
      data.context = selectedFiles.appendTo(ul); 

      data.submit(); 
     }, 

     progress: function (e, data) { 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
      $('#progress .bar').css('width', progress + '%'); 
     } 

     //multipart: false 

    });    

}); 

私は...私は自分自身でこれを考え出していないだろうblueimpのjqueryのファイルアップロードプラグインを使用してファイルをアップロードするにMartin Angelov'sチュートリアルへの感謝を認めなければなりません。 ;）

私はこれが助けてくれることを願っています！