これは非常に基本的なHTMLフォームの送信に関する問題ですが、非常に実用的なテクニックでもあります。 私の業務シーンは次のとおりです: inputを動的に作成できるフォームです。下の図のように。

これは、inputのnameを固定値にできないことを意味します。さもなければ、間違いなく上書きされてしまいます。

1つ目は、従来の一般的な送信方法で、送信する各inputに一意のnameを付けます。



......

ブラウザが送信したデータをキャプチャした形式は次のようになります。

サーバー側で取得して出力するとこのようになり、バックエンドでのデータ処理には非常に不親切です。

2つ目は、配列形式でのフォーム送信です。



......

ブラウザとバックエンドでの出力はそれぞれ次のようになります。

よく見ると、送信されたnameの値が変化し、同じような?配列?になっていることがわかります。 バックエンドに送信すると、データが以前よりもずっと整理されていることがわかります。 ただし、ここで注意すべき点は、送信する配列のキーに引用符を使用する必要はないということです。さもなければ、引用符もキーの一部になってしまいます。

もちろん、実際の開発では、送信するグループの数(上記の1、2、3のような)が不確定で、フロントエンドで自由に追加できるという問題に遭遇することもあります。このような場合、どうやって配列を使ってこれらの内容を送信すればよいのでしょうか? 以下が私の業務での実際の解決策です

このようにすれば、2次元配列のキーを自分で管理する必要がなくなり、ブラウザが自動的に生成してくれます。
バックエンドで受信したデータはこのようになり、非常に処理しやすくなります。
この方法は、不確定な数の関連データセットをまとめて送信する場合に適しています。 一件落着!〜

著作権表示

著者: MoeJue

リンク: https://ja.moejue.cn/posts/91/

ライセンス: クリエイティブ・コモンズ表示-非営利-継承4.0国際ライセンス

この作品は、クリエイティブ・コモンズ表示-非営利-継承4.0国際ライセンスに基づいてライセンスされています。

検索を開始

キーワードを入力して記事を検索

↑↓
ESC
⌘K ショートカット