エラーが発生した場合にのみフォームが送信されないようにする方法

Dec 05 2020

エラーが発生した場合にのみフォームが送信されないようにしようとしています

この関数をフォームonSubmitにリンクしています

const submitHandler = async (e) => {
        e.preventDefault();
        try {
            const submitForm = await axios.post(
                "http://localhost:5000/users/register",
                info
            );
            setError("");
        } catch (error) {
            const err = error.response.data.msg;
            setError(err);
            // display the msg on screen
        }
    };

現在、フォームを停止して応答メッセージを表示するe.preventDefault()が上部にありますが、「catch」にエラーがあった場合にのみ発生させたいです。

それ以外の場合は、送信して、ログインページにリダイレクトするなどの操作を行います。

回答

M11CH Dec 05 2020 at 01:48

tryブロックで.submit()は、フォームのIDでjQueryのメソッドを使用できます。

$("#ID").submit();

jQueryを使用していない場合は、バニラJSを使用できます。

document.getElementById("myForm").submit();