formタグでsubmitしてもページ遷移しないようにする

通常HTMLフォームはsubmitボタンがクリックされたら中のinputタグの内容をすべてパラメータに含めてactionで指定されたURLにアクセス（ページ遷移）します。

たとえば、下記のようなHTMLでフォームにhogeと書いてsearchボタンをクリックすると/search?q=hogeというURLに遷移します。

<form action="/search" method="GET">
  <input name="q"/>
  <input type="submit" value="search"/>
</form>

AipoのフォームのようにAjaxで通信を行う場合や、Javascriptでその他の処理を行って現在のページに内容を反映させたい場合は、formのonsubmitで最後にfalseを返すようにします。

下記のようにすると、doSomething()を実行してその後でページ遷移しなくなります。

<form action="/search" method="GET" onsubmit="doSomething();return false;">
  <input name="q"/>
  <input type="submit" value="search"/>
</form>

注意点として、doSomething()の途中でエラーが発生してしまうとreturn falseが呼ばれずにページが遷移してしまいます。どうしてもページを遷移させたくないときはdoSomethingの中で必ずエラーをキャッチするような機構にしておきましょう。