diff --git a/web/src/ProviderTable.js b/web/src/ProviderTable.js
index b77f46d1..808a6c9a 100644
--- a/web/src/ProviderTable.js
+++ b/web/src/ProviderTable.js
@@ -77,7 +77,7 @@ class ProviderTable extends React.Component {
                       this.updateField(table, index, 'provider', provider);
                     }} >
               {
-                this.props.providers.filter(provider => table.filter(providerItem => providerItem.name === provider.name).length === 0).map((provider, index) => <Option key={index} value={provider.name}>{provider.name}</Option>)
+                Setting.getDeduplicatedArray(this.props.providers, table, "name").map((provider, index) => <Option key={index} value={provider.name}>{provider.name}</Option>)
               }
             </Select>
           )
diff --git a/web/src/Setting.js b/web/src/Setting.js
index b8c4f24a..6bae541f 100644
--- a/web/src/Setting.js
+++ b/web/src/Setting.js
@@ -453,3 +453,8 @@ export function getArrayItem(array, key, value) {
   const res = array.filter(item => item[key] === value)[0];
   return res;
 }
+
+export function getDeduplicatedArray(array, filterArray, key) {
+  const res = array.filter(item => filterArray.filter(filterItem => filterItem[key] === item[key]).length === 0);
+  return res;
+}
diff --git a/web/src/SignupTable.js b/web/src/SignupTable.js
index dac58310..d44df7ad 100644
--- a/web/src/SignupTable.js
+++ b/web/src/SignupTable.js
@@ -68,6 +68,18 @@ class SignupTable extends React.Component {
         dataIndex: 'name',
         key: 'name',
         render: (text, record, index) => {
+          const items = [
+            {id: 'Username', name: 'Username'},
+            {id: 'ID', name: 'ID'},
+            {id: 'Display name', name: 'Display name'},
+            {id: 'Affiliation', name: 'Affiliation'},
+            {id: 'Email', name: 'Email'},
+            {id: 'Password', name: 'Password'},
+            {id: 'Confirm password', name: 'Confirm password'},
+            {id: 'Phone', name: 'Phone'},
+            {id: 'Agreement', name: 'Agreement'},
+          ];
+
           return (
             <Select virtual={false} style={{width: '100%'}}
                     value={text}
@@ -75,17 +87,7 @@ class SignupTable extends React.Component {
                       this.updateField(table, index, 'name', value);
                     }} >
               {
-                [
-                  {id: 'Username', name: 'Username'},
-                  {id: 'ID', name: 'ID'},
-                  {id: 'Display name', name: 'Display name'},
-                  {id: 'Affiliation', name: 'Affiliation'},
-                  {id: 'Email', name: 'Email'},
-                  {id: 'Password', name: 'Password'},
-                  {id: 'Confirm password', name: 'Confirm password'},
-                  {id: 'Phone', name: 'Phone'},
-                  {id: 'Agreement', name: 'Agreement'},
-                ].map((item, index) => <Option key={index} value={item.id}>{item.name}</Option>)
+                Setting.getDeduplicatedArray(items, table, "name").map((item, index) => <Option key={index} value={item.name}>{item.name}</Option>)
               }
             </Select>
           )