web-dev-qa-db-ja.com

Dropzone.jsの投稿にデータを追加する

したがって、このチュートリアルの実装はここにあります： http://www.dropzonejs.com/bootstrap.html

それはうまく機能していて、私はファイルをうまくアップロードしています。私が今やりたいのは、Dropzoneが画像をアップロードするときにPOSTデータの画像と一緒にユーザーIDを送信できるようにすることです。enyoのチュートリアルを見つけました ここ これは、非表示のフォームデータをドロップゾーンに追加する方法を説明していますが、bootstrapチュートリアルdropzoneが提供するものを使用すると、フォームがないため、非表示の投稿データを送信できません。

上記にリンクされているbootstrapチュートリアルのコードを使用しても、非表示の入力データをアップロードスクリプトに送信するにはどうすればよいですか？提供されたコードをフォームに変換する必要がありますか？だから、どうすればいいですか？

javascripttwitter-bootstrapdropzone.js
8
dmarzio

この質問をしてからしばらく経ちましたが、dropzoneWebサイトのヒントに基づいています

http://www.dropzonejs.com/#tips

あなたは3つのことのうちの1つをすることができるはずです-

1。フォームがある場合は、非表示のパラメータを追加します。

2。あなたはそのようなパラメータを使うことができます-

new Dropzone({
    url: "/",
    params: {
         foo: "bar"
    }
});

3。 on sendイベントを次のように処理します-

myDropzone.on("sending", function(file, xhr, formData) { 

// Will sendthe filesize along with the file as POST data.

 formData.append("filesize", file.size);  

});
30
Egon

実際、フォームが含まれていないため、提供しているチュートリアルは少し混乱していると思います。 class="dropzone"を使用してフォームを作成し、非表示の入力を追加するだけです。ドロップされたファイルのデフォルトテンプレートと、基本的なイベント処理用のJSコードのみが表示されます。例として Dropzoneのメインページ をチェックすることをお勧めします。

たとえば、私たちのコードでは、次のようになります（少し編集されています）：

<form action="myAction"
      class="dropzone"
      id="dropzoneId"
      name="pictures">
    <input type="hidden" name="id">
</form>

そして、本当に、それだけです。非表示のidフィールドといくつかのより洗練された機能を処理するためのJavascriptコードがいくつかありますが、IDは画像データと一緒に投稿されます。

5
SolarBear

私はこれがかなり古い投稿であることを知っていますが、SolarBearの答えを機能させようとしましたが、このように非表示の入力にパラメーター「value」を追加するとうまくいきました。

<form action="/action.php" class="dropzone">
<input type="hidden" name="additionaldata" value="valueToPass" />
</form>

ご協力いただきありがとうございます！

4
NorahKSakal