ASP.NET ドラッグ＆ドロップでのファイルアップロード

Question

現在、VisualStudio2005 C# .NET FrameWork2.0にて開発を行っており、asp.net MVCを使用せず、ファイルをドラッグ＆ドロップで一度に複数アップロードできる機能を実装したいと考えています。

色々と調べた結果、JQueryを使用して実装することにし、

Dropzone.js http://www.dropzonejs.com/
jQuery-File-Upload http://blueimp.github.io/jQuery-File-Upload/

などを中心に色々と調べてみました。

しかし、上記の開発環境に対応した参考になるソースが一切でてきません。(既に10時間以上は調べてます)

私の知識が乏しいため、必要な情報を逃してしまっていることもあるかもしれませんが、どなたかお分かりになるようでしたらご教授お願いしたいです。

よろしくお願いします。

Answer 1

大体以下のような感じでしょうか。私の場合は、アップロードされたファイルはサーバー内のディレクトリには保存せず、バイナリでSQL Server の中に保存しています。

<div id="dropzoneInsert" class="dropzone dropzoneMyStyle">
    <div class="dz-message dz-remove">ここにファイルを載せるとアップロードできます。またクリックすることにより通常の「ファイル選択」でもアップロードできます。</div>
</div>


<script>
$(function () {
    //ページ読み込み時の自動検出を無効にする（複数配置で読み込みエラーが発生するため）
    Dropzone.autoDiscover = false;
    //新規登録時のD&D
    $('#dropzoneInsert').dropzone({
        paramName: "file"
        ,createImageThumbnails:false
        ,maxFilesize: 1000 // MB
        ,uploadMultiple: true //複数ファイルのアップロードを許可する
        ,parallelUploads:1 //複数ファイルのアップロードは1つずつ処理する
        //,createImageThumbnails: false //サムネイルは作成しない
        ,method: "post"
        ,url: "../main/upload.aspx?cmd=ins&func=1&key=" + '<%=Request.QueryString("id")%>'
        ,addRemoveLinks: false
        ,dictRemoveFile: ""//削除の文字は表示させない
        ,totaluploadprogress: function(progress, totalBytes, totalBytesSent){
            //success や complete では複数ファイルのアップロードが終わる前に動いてしまうので、ここで100%になった時点で処理を走らせる
            var button = $("#<%=ButtonAutoClick.ClientID%>");
            if (progress==100) button.click();//表示を更新させるだけ
        }
    
        ,error: function(file, message) {
            $(file.previewElement) // 対象の要素
            console.log(file);
            console.log(message); // アップ失敗の理由
            //alert(message);
        }
    
    });

});
</script>

Try
                Dim i As Integer = 0 'ファイル数カウンター
                Dim CommandName As String = Request.QueryString("cmd")      '-- ins：インサート、del：削除
                Dim FunctionNumber As Integer = Request.QueryString("func") '-- 機能番号
                Dim DataKey As Integer = Request.QueryString("key")         '-- 機能の中での主キー
                Dim UploadFile As HttpPostedFile

                Select Case CommandName
                    Case Is = "ins" '-- 追加処理
                        Dim cls As New clsDatabase

                        Using ts As New TransactionScope()
                            '-- ファイルの数だけループ
                            Do Until i = Request.Files.Count
                                UploadFile = Request.Files(i)

                                Dim UpContentType As String = UploadFile.ContentType
                                Dim UpFileName As String = System.IO.Path.GetFileName(UploadFile.FileName)
                                Dim UpContentLength As Integer = UploadFile.ContentLength

                                If UpContentLength > 0 Then '-- 内容が1バイト以上だったら処理する

                                    '-- SQLに引き渡せるよう、アップロードファイルを入力ストリーム経由でbyte配列に読み込む
                                    Dim aryData(UpContentLength - 1) As Byte '-- 配列なのでファイルのバイト数より1つ少ない数を指定する
                                    UploadFile.InputStream.Read(aryData, 0, UpContentLength)
                                    Select Case FunctionNumber '-- ループの外で判断したいがここ以外は共通なので ...
                                        Case Is = 1
                                            cls.Insert_wFile(FunctionNumber, DataKey, UpContentType, UpFileName, UpContentLength, aryData)
                                    End Select
                                    
                                End If
                                i += 1
                            Loop
                            ts.Complete()
                        End Using

                        cls = Nothing

                    Case Is = "del"
                        '    '削除処理を入れる
                End Select
            Catch ex As Exception
                Throw
            Finally

            End Try

Answer 2

まず、これからかも
検索ワード：質問の掲示のまんまで
ファイルをドラッグ＆ドロップで一度に複数アップロード
https://www.google.co.jp/search?q=%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%92%E3%83%89%E3%83%A9%E3%83%83%E3%82%B0%EF%BC%86%E3%83%89%E3%83%AD%E3%83%83%E3%83%97%E3%81%A7%E4%B8%80%E5%BA%A6%E3%81%AB%E8%A4%87%E6%95%B0%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89&rls=com.microsoft:ja-JP:IE-ContextMenu&ie=UTF-8&oe=UTF-8&sourceid=ie7&gfe_rd=cr&ei=tIKRV-rOCauL8QfR6oHYCg&gws_rd=ssl

C# Ajax
https://www.google.co.jp/search?q=C%23+Ajax&rls=com.microsoft:ja-JP:IE-Address&ie=UTF-8&oe=UTF-8&sourceid=ie7&gfe_rd=cr&ei=g4ORV_OjGKmL8Qen2oCoAw&gws_rd=ssl

jQuery / Ajax ：Java Version 、OS / IIS Versionと合わせて検討になるのかも

何らかの理由があっての、ふる～い環境(VS2005/.NetFramework2.0)であれば、
出来る事は限られます。
費用面や、使っていない（VS2013 Community / VS2015 Community）という事であれば、
可能であれば、VS2013 / VS2015 で。
VS2013 / VS2015 で、ASP.NET WEB サイト、ASP.NET WEB プロジェクトは変更、作成可能です。
.NetFramework 2.0 ～ も