diff --git a/web/src/SelectRegionBox.js b/web/src/SelectRegionBox.js
index 76aa94a1..552f3eb9 100644
--- a/web/src/SelectRegionBox.js
+++ b/web/src/SelectRegionBox.js
@@ -47,7 +47,7 @@ class SelectRegionBox extends React.Component {
           >
             {
                 Setting.CountryRegionData.map((item, index) => (
-                    <Option key={index} value={item.name} label={item.name} >
+                    <Option key={index} value={item.code} label={item.code} >
                         <img src={`${Setting.StaticBaseUrl}/flag-icons/${item.code}.svg`} alt={item.name} height={20} style={{marginRight: 10}}/>
                         {`${item.name} (${item.code})`}
                     </Option>
diff --git a/web/src/UserListPage.js b/web/src/UserListPage.js
index b3a6fdce..c45603ed 100644
--- a/web/src/UserListPage.js
+++ b/web/src/UserListPage.js
@@ -116,6 +116,13 @@ class UserListPage extends React.Component {
   }
 
   renderTable(users) {
+    // transfer country code to name based on selected language
+    var countries = require("i18n-iso-countries");
+    countries.registerLocale(require("i18n-iso-countries/langs/" + i18next.language + ".json"));
+    for (var index in users) {
+      users[index].region = countries.getName(users[index].region, i18next.language, {select: "official"})
+    }
+
     const columns = [
       {
         title: i18next.t("general:Organization"),