🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

1250閲覧

javascriptで更新した値をPHP側の$_POSTや$_FILESで受け取りたい

fuyukixxx

総合スコア26

POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/03/30 10:21

javascriptのFormData.setを使ってinputタグの値を更新してサブミットしたらPHPのグローバル変数、$_POSTや$_FILESで受け取りたいのですがうまくいきません。
何を付け加えたらサーバー側にデータを反映できますか。
ご助力お願いいたします。

HTML

1コード 2<body> 3<form id="form" method="post"> 4<input id="text" type="text" name="text"/> 5<button type="submit">送信</button> 6</form>

JS

1コード 2const postForm = new FormData(document.forms.form); 3postForm.set('text','こんにちは'); 4for (let setPost of postForm) { 5 6 console.log(setPost); 7}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maisumakun

2021/03/30 10:23

postFormが使われているコードはこれだけですか?
fuyukixxx

2021/03/30 11:12

追記ありがとうございます。これだけです。
takasima20

2021/03/30 11:32

よくわかりませんが、name属性が必須っぽいスよ?
yambejp

2021/03/30 12:13

何がしたいか分かりづらいですね 非同期で送りたいのか、サブミットしたいのかもわかりません サブミットするならjsは不要です (サブミットする際に項目を追加するなら可能ですが) またtype=fileの記述がないので$_FILESで受けられるソースにはなってないです
guest

回答2

0

ベストアンサー

FormDataを使ったAjaxによるデータ送信と、ブラウザのsubmitを使ったフォーム送信は、1回の送信に対して両立しません。どちらか一方だけを使う形にしてください。以下2つのどちらかのパターンになります。

  • 作ったFormDataオブジェクトをXMLHTTPRequestなりfetchなりでサーバサイドへ送信する
  • FormDataオブジェクトは作らず、<input type="hidden">を動的にフォーム内に作って値を書き出し、ブラウザのフォーム送信に任せる

投稿2021/03/30 11:28

maisumakun

総合スコア145971

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maisumakun

2021/03/30 11:28

FormDataは、newしただけでは単なるオブジェクトです。サーバサイドに影響を及ぼすことはありません。
fuyukixxx

2021/03/31 08:51

回答ありがとうございます。FormDataのパターンは一回置いておきます。オーディオデータを更新したいので$_FILESでうけとりたく、<input type="file">のvalueにblobデータを上書きしてみたのですが、エラーがでます。 Uncaught DOMException: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string. <input type="file">のvalue属性に上書きするには何が最適でしょうか。すみませんが回答宜しくお願いします。
maisumakun

2021/03/31 08:54

<input type="file">に書き出す場合、value経由ではなく、.filesにFileListというオブジェクトを入れる必要があります。 しかも、iOSは現行の14系列でも自力でFileListを作る方法がないため、実行できません。
guest

0

そのままじゃ無理ですね。間にデータベースかファイルをかまして、そこから読み込むようにすれば、やりたいことと同じことはできるとは思います。

  1. スクリプト処理でファイルをデータベース内テーブルか管理ファイルに格納
  2. PHPでサーバ転送後に1で処理したデータを読み込む
  3. そのデータを処理する

投稿2021/03/31 02:23

編集2021/03/31 02:24
FKM

総合スコア3647

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問