AjaxをやるときのHTMLとサーバー側コードの書き方を整理する

Ajaxをやろうとして沼だったので、書いて整理したい。

jQueryで$.ajaxを使う一方で画面遷移が起こらないようにpreventDefaultでブラウザのリクエストを止めるか、そもそもHTMLでSubmitしないようにする必要がある。

NGパターン

Ajaxなのに画面遷移してしまう残念パターン。

HTMLでSubmitする＋jsでpreventDefaultしていない

ちゃんと非同期通信できるのは

HTMLでSubmitしない or HTMLでSubmitする＋jsでpreventDefaultする

とても参考になるリンクがあったので貼る。