jquery フォームに要素を追加する方法

フォームに対して動的に要素を追加する方法になります。

実装について

方法としては、あらかじめ作成しておいた(html に記述しておいた)フォームに後から jquery で要素を追加する形になります。

コード＆解説

ベースとなるフォームを作成しておきます。

id を指定して追加を行いますので、適当な id を付けておいてください。

<form id="myform">
</form>

javascript 側です。

今回は hidden の要素を追加します。

データをポストしたいので、name や value を追加しておきます。

appendTo のところに、追加する対象のフォームを id で指定します。

$("<input>", {
  type: 'hidden',
  id: 'myinput',
  name: 'myinput',
  value: 10000
}).appendTo('#myform');

このコードを実行すると、myform という id のフォームに hidden の input タグが追加されます。

この後、ポストすれば、myinput という名前で値がポストされます。