8158


javascriptで、drag&dropされたファイルのfile objectを取得しており、そのファイル情報を画面に出力しています。

ファイル情報出力時、input
type="file"タグに取得ファイルを設定して画面に出力することはセキュリティ上できないようなので、Pタグで表示していますがsubmitボタン押下時のsubmit対象にはなりません。

取得し、画面出力しているfile
objectを、submitボタン押下時のsubmit対象にしたいのですが、どのようにsubmitの対象にすればよいか分かりません。  
方法が分かる方がいましたら、ご教授をお願いします。

また、ファイルがdrag&dropされるたびに送信する方法は無しでお願いします。

・file object取得時ソース  

[code]

    var files = e.target.files
    
[/code]

・画面出力時ソース  
fileは取得したfile objectです  

[code]

    Output(
                "<p id = 'MessageParagraph'>name: <strong>" + file+
                "</strong> size: <strong>" + file.size +
                "</strong> bytes" +
                "<input id = 'Cancel' type = 'button' onclick = 'this.parentElement.remove()' value = 'Cancel' />" +
                "</p>"
            );
    
[/code]


CC BY-SA 3.0
2015-03-19T05:00:18.480
8097
2015-03-20T01:22:11.420
2015-03-19T06:03:55.043
7626
7626
question
javascript html css
取得したfile objectを、submitの対象にするには？


`FileReader`を利用してJavascriptでデータを読み込んで下さい。

ユーザが選択したファイルが、そのブラウザで表示可能な形式（画像や動画など）であれば、選択したファイルを画面に出力することは可能なはずです。

読み込んだデータをsubmitの対象にするには`form`タグに以下のような`input type="hidden"`を追加します。

[code]

    <input type="hidden" name="[ここに名前]" value="[ここにbase64などのデータの実態]">
    
[/code]


CC BY-SA 3.0
2015-03-19T10:10:48.860
8125
2015-03-19T10:10:48.860
8351
8097
answer


file objectを格納しているリストをグローバル変数化し、  
submit時にformタグ内の画面情報と、FileData.appendを使用してグローバル変数リストをformに追加。


CC BY-SA 3.0
2015-03-20T01:22:11.420
8158
2015-03-20T01:22:11.420
7626
8097
answer