この記事では、DjangoのFormで多重submitを防ぐ方法について説明します。
Djangoの…と書いてはいますが、Djangoに限らず、HTMLのformを使用するのであればどこでも使用可能だと思います。

この記事の内容です。

• 対象読者
• 環境
• 前提条件
• DjangoのFormで多重submitを防ぐ

対象読者

• DjangoのFormで多重submitを防ぎたい方

環境

• Django v4.1.2

前提条件

• なし

DjangoのFormで多重submitを防ぐ

以下のようにformのtypeがsubmitのinput要素に、onclickイベントを設定する。

<input type="submit" value="送信" onclick="this.disabled=true,this.form.submit();">

これだけで、HTMLのformで多重submitを防ぐことができます。
ただ、この方法だと連続でクリックしても2回目以降がsubmitされないというだけで、見た目は何も変わりません。
もし見た目の変化 (1回クリックされたらグレーアウトするなど) が必要であれば、別途JavaScriptやTypeScriptにてCSSを動的に変更する処理を実装し使用してください。