1

次のようなフォームがあります。

<form id="uploadForm" name="uploadForm" method="post" enctype="multipart/form-data">
    <input type="file" id="uploadFile" name="uploadFile" /><br />
    <input type="submit" id="process" name="process" value="Process File" />
</form>

ユーザーがファイルをアップロードして処理できるようにしたい。ユーザーが「プロセス」を押したときに、jquery 投稿を使用してこのページを呼び出したい (このフォームは cfwindow に表示されており、cfwindow を離れたくありません)、何らかの処理を行い、メッセージを出力します。これは私が通常使用するコードです：

$('#process').click(function(){
    $.post('<cfoutput>#cgi.script_name#</cfoutput>', $('#uploadForm').serialize(), function(data){
        ... some processing ...
    });
});

ただし、何も渡されていません。さらに調査した結果、 serialize関数の jquery ドキュメントにたどり着きました。

ファイル選択要素からのデータはシリアル化されません。

ファイル選択要素を渡すにはどうすればよいですか?

(これが違いを生む場合-ページに投稿するときに、このコードを使用して、ファイル選択要素でアップロードされたファイルを読み取ります:

<cfspreadsheet action="read" src="#form.uploadFile#" sheet="1" query="spreadsheetData" headerRow="1" excludeHeaderRow="true">

もともと私は通常の形式のポストを使用していましたが、完全に機能していました. リロードする代わりに cfwindow を開いたままにできるように、ajax に切り替えたいと思います。)

4

2 に答える 2

3

Valums File Uploaderプロジェクトを見てください。あなたがやろうとしているように、XHRを介してアップロードできます。彼のライブラリを使用するか、彼のコンセプトをあなたがやろうとしていることに適応させることができます。

于 2012-05-24T09:50:57.803 に答える
0

これを回避する従来の方法は、非表示の iFrame を対象とするフォームを作成することです。

<!-- fileupload.cfm -->
<script>function functionToHandleUploadComplete(){ // Do things here }</script>
<form action="getfile.cfm" method="post" target="myHiddeniFrame" />
  <input type="file" name="myFile" />
  <!-- your fields -->  
</form>

<iframe id="myHiddeniFrame" style="somthing to hide the frame" />

<!-- getFile.cfm loaded in an iFrame within fileUpload.cfm-->
<cffile action="upload" formField="myFile" ..... />
<cfoutput>
  <script>
    window.parent.functionToHandleUploadComplete();
  </script>
</cfoutput>

私たちの製品ではこのアプローチを使用しており、うまく機能しています。送信先のページが同じドメインにある場合は、javascript をプッシュして、含まれているページにアップロードが完了したことを伝えることができます。

ただし、かなり気の利いたように見えるので、最初に File Uploader プロジェクトを見てみたいと思います。

于 2012-05-24T10:21:43.997 に答える