引き続きApplicationControllerを使ったAjax処理の省力化について紹介します。今回はフォームの同時送信です。
HTMLでは基本的に一回のアクションで一つのフォームしか送信できません。しかしAjaxであれば並行処理を使って同時送信も可能です。ApplicationControllerではごく簡単に実装できます。
実装方法としては h5-refresh-group を指定します。この名前が同じであれば、同時に送信されるようになります。
JavaScriptは変わりません。特別な設定は不要です。
これだけでフォームを送信すると二つのフォームが同時に送信されるようになります。インジケータも二つ同時に回っているのが分かります。
実際のデモはこちらにて確認できます。サーバ送信部分はモックですが、サーバを立てた場合と同じです。
二つの要素を同時に更新したいという時に使えます。特に、フォーム内で同じnameであったとしても使えるのが利点と言えるでしょう（通常のHTMLで、一つのフォーム内に同じname指定があると上書きしてしまいます）。
