diff --git a/controllers/auth.go b/controllers/auth.go
index f9995830..8be118a9 100644
--- a/controllers/auth.go
+++ b/controllers/auth.go
@@ -986,6 +986,18 @@ func (c *ApiController) Login() {
 		}
 	}
 
+	if authForm.Language != "" {
+		user := c.getCurrentUser()
+		if user != nil {
+			user.Language = authForm.Language
+			_, err = object.UpdateUser(user.GetId(), user, []string{"language"}, user.IsAdmin)
+			if err != nil {
+				c.ResponseError(err.Error())
+				return
+			}
+		}
+	}
+
 	c.Data["json"] = resp
 	c.ServeJSON()
 }
diff --git a/form/auth.go b/form/auth.go
index 72057b90..91a3ee54 100644
--- a/form/auth.go
+++ b/form/auth.go
@@ -34,6 +34,7 @@ type AuthForm struct {
 	Phone          string `json:"phone"`
 	Affiliation    string `json:"affiliation"`
 	IdCard         string `json:"idCard"`
+	Language       string `json:"language"`
 	Region         string `json:"region"`
 	InvitationCode string `json:"invitationCode"`
 
diff --git a/web/src/auth/LoginPage.js b/web/src/auth/LoginPage.js
index 6b5b2565..48075c14 100644
--- a/web/src/auth/LoginPage.js
+++ b/web/src/auth/LoginPage.js
@@ -61,6 +61,7 @@ class LoginPage extends React.Component {
       isTermsOfUseVisible: false,
       termsOfUseContent: "",
       orgChoiceMode: new URLSearchParams(props.location?.search).get("orgChoiceMode") ?? null,
+      userLang: null,
     };
 
     if (this.state.type === "cas" && props.match?.params.casApplicationName !== undefined) {
@@ -415,6 +416,7 @@ class LoginPage extends React.Component {
 
   login(values) {
     // here we are supposed to determine whether Casdoor is working as an OAuth server or CAS server
+    values["language"] = this.state.userLang ?? "";
     if (this.state.type === "cas") {
       // CAS
       const casParams = Util.getCasParameters();
@@ -566,7 +568,7 @@ class LoginPage extends React.Component {
       return (
         <div key={resultItemKey} className="login-languages">
           <div dangerouslySetInnerHTML={{__html: ("<style>" + signinItem.customCss?.replaceAll("<style>", "").replaceAll("</style>", "") + "</style>")}} />
-          <LanguageSelect languages={application.organizationObj.languages} />
+          <LanguageSelect languages={application.organizationObj.languages} onClick={key => {this.setState({userLang: key});}} />
         </div>
       );
     } else if (signinItem.name === "Signin methods") {
@@ -805,7 +807,6 @@ class LoginPage extends React.Component {
         <Form
           name="normal_login"
           initialValues={{
-
             organization: application.organization,
             application: application.name,
             autoSignin: true,
diff --git a/web/src/common/select/LanguageSelect.js b/web/src/common/select/LanguageSelect.js
index 0bf9e9ef..3856be64 100644
--- a/web/src/common/select/LanguageSelect.js
+++ b/web/src/common/select/LanguageSelect.js
@@ -30,6 +30,7 @@ class LanguageSelect extends React.Component {
     this.state = {
       classes: props,
       languages: props.languages ?? Setting.Countries.map(item => item.key),
+      onClick: props.onClick,
     };
 
     Setting.Countries.forEach((country) => {
@@ -50,6 +51,9 @@ class LanguageSelect extends React.Component {
   render() {
     const languageItems = this.getOrganizationLanguages(this.state.languages);
     const onClick = (e) => {
+      if (typeof this.state.onClick === "function") {
+        this.state.onClick(e.key);
+      }
       Setting.setLanguage(e.key);
     };