diff --git a/web/src/auth/mfa/MfaVerifyTotpForm.js b/web/src/auth/mfa/MfaVerifyTotpForm.js
index 7f6a117e..72b4c6dc 100644
--- a/web/src/auth/mfa/MfaVerifyTotpForm.js
+++ b/web/src/auth/mfa/MfaVerifyTotpForm.js
@@ -1,4 +1,4 @@
-import {CopyOutlined, UserOutlined} from "@ant-design/icons";
+import {CopyOutlined} from "@ant-design/icons";
 import {Button, Col, Form, Input, QRCode, Space} from "antd";
 import copy from "copy-to-clipboard";
 import i18next from "i18next";
@@ -47,11 +47,11 @@ export const MfaVerifyTotpForm = ({mfaProps, onFinish}) => {
         name="passcode"
         rules={[{required: true, message: "Please input your passcode"}]}
       >
-        <Input
+        <Input.OTP
           style={{marginTop: 24}}
-          prefix={<UserOutlined />}
-          placeholder={i18next.t("mfa:Passcode")}
-          autoComplete="off"
+          onChange={() => {
+            form.submit();
+          }}
         />
       </Form.Item>
       <Form.Item>