AjaxによるForm送信
スポンサードリンク
prototype.jsのAjax.RequestとForm.serializeを組み合わせる bookmark
prototype.jsのAjax.RequestではAjaxによってサーバへリクエストの処理が行えます。そして、Form.serializeという便利な機能もあって、これはフォームの内容を、a=b&c=dのようなサーバに送信しやすい形にしてくれるものです。
コードを見てみよう bookmark
コードの解説 bookmark
ボタンをクリックするとexecute関数が呼ばれるようになっています。
クリック時に、Form.serialize('form1')とすることで、フォーム内の内容を１行の文字列にしています。その後、Ajax.Requestを使ってサーバにリクエストします。onSuccessによって、成功時にはサーバからのレスポンスを表示するようにしています。
ここで使ったバックエンド用のサンプルプログラムは次のような感じです。phpで書いています。
Ajaxを使ったサンプルでは、成功時に、バックエンドのメッセージである「データを書き込みました」をそのままalertで出すようにしています。
スポンサードリンク