diff --git a/dashboard/src/components/ExternalLdap.vue b/dashboard/src/components/ExternalLdap.vue
index b0d39a560..7a3514f65 100644
--- a/dashboard/src/components/ExternalLdap.vue
+++ b/dashboard/src/components/ExternalLdap.vue
@@ -1,7 +1,7 @@
 <script setup>
 
-import { ref, useTemplateRef, onMounted, computed, inject } from 'vue';
-import { Dialog, Button, Icon, FormGroup, SingleSelect, Checkbox, TextInput, ProgressBar, PasswordInput } from '@cloudron/pankow';
+import { ref, useTemplateRef, onMounted, inject } from 'vue';
+import { Dialog, Button, Icon, FormGroup, MaskedInput, SingleSelect, Checkbox, TextInput, ProgressBar } from '@cloudron/pankow';
 import { prettyLongDate } from '@cloudron/pankow/utils';
 import Section from './Section.vue';
 import UserDirectoryModel from '../models/UserDirectoryModel.js';
@@ -46,15 +46,26 @@ const bindDn = ref('');
 const bindPassword = ref('');
 const autoCreate = ref(false);
 
-const isValid = computed(() => {
-  if (!provider.value) return false;
-  if (!url.value) return false;
-  if (!baseDn.value) return false;
-  if (!filter.value) return false;
-  if (bindDn.value && !bindPassword.value) return false;
+const form = useTemplateRef('form');
+const isFormValid = ref(false);
+function checkValidity() {
+  isFormValid.value = form.value.checkValidity();
+}
 
-  return true;
-});
+function onProviderChange() {
+  url.value = '';
+  acceptSelfSignedCerts.value = false;
+  baseDn.value = '';
+  filter.value = '';
+  usernameField.value = '';
+  syncGroups.value = false;
+  groupBaseDn.value = '';
+  groupFilter.value = '';
+  groupnameField.value = '';
+  bindDn.value = '';
+  bindPassword.value = '';
+  autoCreate.value = false;
+}
 
 async function onConfigure() {
   if (!features.value.externalLdap) return subscriptionRequiredDialog.value.open();
@@ -76,10 +87,12 @@ async function onConfigure() {
   autoCreate.value = config.value.autoCreate;
 
   dialog.value.open();
+
+  setTimeout(checkValidity, 100); // update state of the confirm button
 }
 
 async function onSubmit() {
-  if (!isValid.value) return;
+  if (!form.value.reportValidity()) return;
 
   editBusy.value = true;
   editError.value = {};
@@ -91,7 +104,7 @@ async function onSubmit() {
     config.acceptSelfSignedCerts = acceptSelfSignedCerts.value;
     config.autoCreate = autoCreate.value;
     config.syncGroups = syncGroups.value;
-    config.bindPassword = bindPassword.value;
+    if (bindPassword.value) config.bindPassword = bindPassword.value;
 
     // those values are known and thus overwritten
     config.baseDn = 'ou=users,dc=cloudron';
@@ -115,7 +128,7 @@ async function onSubmit() {
 
     if (bindDn.value) {
       config.bindDn = bindDn.value;
-      config.bindPassword = bindPassword.value;
+      if (bindPassword.value) config.bindPassword = bindPassword.value;
     }
   }
 
@@ -230,78 +243,78 @@ onMounted(async () => {
         :title="$t('users.externalLdapDialog.title')"
         :confirm-label="$t('main.dialog.save')"
         :confirm-busy="editBusy"
-        :confirm-active="!editBusy && isValid"
+        :confirm-active="!editBusy && isFormValid"
         :reject-label="$t('main.dialog.cancel')"
          reject-style="secondary"
         @confirm="onSubmit()"
       >
       <p class="has-error text-center" v-show="editError.generic">{{ editError.generic }}</p>
 
-      <FormGroup>
-        <label for="ldapProvider">{{ $t('users.externalLdap.provider') }} <sup><a href="https://docs.cloudron.io/user-directory/#external-directory" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
-        <SingleSelect id="ldapProvider" v-model="provider" :options="availableProviders" option-key="value" option-label="name" />
-        <div class="warning-label" v-show="provider === 'noop' && config.provider !== 'noop'">{{ $t('users.externalLdap.disableWarning') }}</div>
-      </FormGroup>
+      <form ref="form" @submit.prevent="onSubmit()" autocomplete="off" @input="checkValidity()">
+        <fieldset :disabled="editBusy">
+          <input style="display: none" type="submit" :disabled="editBusy || !isFormValid" />
 
-      <div v-show="provider !== 'noop'">
-        <form novalidate @submit.prevent="onSubmit()" autocomplete="off">
-          <fieldset :disabled="editBusy">
-            <input style="display: none" type="submit" :disabled="editBusy || !isValid" />
+          <FormGroup>
+            <label for="ldapProvider">{{ $t('users.externalLdap.provider') }} <sup><a href="https://docs.cloudron.io/user-directory/#external-directory" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+            <SingleSelect id="ldapProvider" @select="onProviderChange" v-model="provider" :options="availableProviders" option-key="value" option-label="name" required/>
+            <div class="warning-label" v-show="provider === 'noop' && config.provider !== 'noop'">{{ $t('users.externalLdap.disableWarning') }}</div>
+          </FormGroup>
 
+          <div v-if="provider !== 'noop'">
             <FormGroup :class="{ 'has-error': editError.url }">
               <label class="control-label" for="configUrlInput">{{ $t('users.externalLdap.server') }}</label>
-              <TextInput id="configUrlInput" v-model="url" placeholder="ldaps://example.com:636" />
+              <TextInput id="configUrlInput" v-model="url" placeholder="ldaps://example.com:636" required/>
             </FormGroup>
 
             <Checkbox v-model="acceptSelfSignedCerts" :label="$t('users.externalLdap.acceptSelfSignedCert')" />
             <p class="has-error" v-show="editError.acceptSelfSignedCerts">{{ $t('users.externalLdap.errorSelfSignedCert') }}</p>
 
-            <FormGroup :class="{ 'has-error': editError.baseDn }" v-show="provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.baseDn }" v-if="provider !== 'cloudron'">
               <label for="baseDnInput">{{ $t('users.externalLdap.baseDn') }}</label>
-              <TextInput v-model="baseDn" id="baseDnInput" placeholder="ou=users,dc=example,dc=com" :required="provider !== 'cloudron'" />
+              <TextInput v-model="baseDn" id="baseDnInput" placeholder="ou=users,dc=example,dc=com" required />
             </FormGroup>
 
-            <FormGroup :class="{ 'has-error': editError.filter }" v-show="provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.filter }" v-if="provider !== 'cloudron'">
               <label for="filterInput">{{ $t('users.externalLdap.filter') }}</label>
-              <TextInput v-model="filter" id="filterInput" placeholder="(objectClass=inetOrgPerson)" :required="provider !== 'cloudron'" />
+              <TextInput v-model="filter" id="filterInput" placeholder="(objectClass=inetOrgPerson)" required />
             </FormGroup>
 
-            <FormGroup :class="{ 'has-error': editError.usernameField }" v-show="provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.usernameField }" v-if="provider !== 'cloudron'">
               <label for="usernameFieldInput">{{ $t('users.externalLdap.usernameField') }}</label>
               <TextInput v-model="usernameField" id="usernameFieldInput" placeholder="uid or sAMAcountName" />
             </FormGroup>
 
             <Checkbox v-model="syncGroups" :label="$t('users.externalLdap.syncGroups')" />
 
-            <FormGroup :class="{ 'has-error': editError.groupBaseDn }" v-show="syncGroups && provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.groupBaseDn }" v-if="syncGroups && provider !== 'cloudron'">
               <label for="groupBaseDnInput">{{ $t('users.externalLdap.groupBaseDn') }}</label>
-              <TextInput v-model="groupBaseDn" id="groupBaseDnInput" placeholder="ou=groups,dc=example,dc=com" :required="syncGroups && provider !== 'cloudron'" />
+              <TextInput v-model="groupBaseDn" id="groupBaseDnInput" placeholder="ou=groups,dc=example,dc=com" required />
             </FormGroup>
 
-            <FormGroup :class="{ 'has-error': editError.groupFilter }" v-show="syncGroups && provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.groupFilter }" v-if="syncGroups && provider !== 'cloudron'">
               <label for="groupFilterInput">{{ $t('users.externalLdap.groupFilter') }}</label>
-              <TextInput v-model="groupFilter" id="groupFilterInput" placeholder="(objectClass=groupOfNames)" :required="syncGroups && provider !== 'cloudron'" />
+              <TextInput v-model="groupFilter" id="groupFilterInput" placeholder="(objectClass=groupOfNames)" required />
             </FormGroup>
 
-            <FormGroup :class="{ 'has-error': editError.groupnameField }" v-show="syncGroups && provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.groupnameField }" v-if="syncGroups && provider !== 'cloudron'">
               <label for="groupnameFieldInput">{{ $t('users.externalLdap.groupnameField') }}</label>
-              <TextInput v-model="groupnameField" id="groupnameFieldInput" placeholder="cn" :required="syncGroups && provider !== 'cloudron'" />
+              <TextInput v-model="groupnameField" id="groupnameFieldInput" placeholder="cn" required />
             </FormGroup>
 
-            <FormGroup :class="{ 'has-error': editError.credentials }" v-show="provider !== 'cloudron'">
+            <FormGroup :class="{ 'has-error': editError.credentials }" v-if="provider !== 'cloudron'">
               <label for="bindDnInput">{{ $t('users.externalLdap.bindUsername') }}</label>
               <TextInput v-model="bindDn" id="bindDnInput" placeholder="uid=admin,ou=Users,dc=example,dc=com" />
             </FormGroup>
 
             <FormGroup :class="{ 'has-error': editError.credentials }">
               <label for="bindPasswordInput">{{ $t('users.externalLdap.bindPassword') }}</label>
-              <PasswordInput v-model="bindPassword" id="bindPasswordInput" />
+              <MaskedInput v-model="bindPassword" id="bindPasswordInput" />
             </FormGroup>
 
             <Checkbox v-model="autoCreate" :label="$t('users.externalLdap.autocreateUsersOnLogin')" />
-          </fieldset>
-        </form>
-      </div>
+          </div>
+        </fieldset>
+      </form>
     </Dialog>
 
     <Section :title="$t('users.externalLdap.title')" :title-badge="!features.externalLdap ? 'Upgrade' : ''">
diff --git a/dashboard/src/views/VolumesView.vue b/dashboard/src/views/VolumesView.vue
index fa9f91772..02093fedb 100644
--- a/dashboard/src/views/VolumesView.vue
+++ b/dashboard/src/views/VolumesView.vue
@@ -141,6 +141,12 @@ async function refresh() {
 const volumeDialog = useTemplateRef('volumeDialog');
 const inputDialog = useTemplateRef('inputDialog');
 
+const form = useTemplateRef('form');
+const isFormValid = ref(false);
+function checkValidity() {
+  isFormValid.value = form.value.checkValidity();
+}
+
 async function openVolumeDialog(volume) {
   volumeDialogData.value.error = null;
   volumeDialogData.value.mode = volume ? 'edit' : 'new';
@@ -177,12 +183,6 @@ async function openVolumeDialog(volume) {
   setTimeout(checkValidity, 100); // update state of the confirm button
 }
 
-const form = useTemplateRef('form');
-const isFormValid = ref(false);
-function checkValidity() {
-  isFormValid.value = form.value.checkValidity();
-}
-
 async function onSubmit() {
   if (!form.value.reportValidity()) return;
 
diff --git a/src/externalldap.js b/src/externalldap.js
index 9212f126c..8e41800fd 100644
--- a/src/externalldap.js
+++ b/src/externalldap.js
@@ -1,21 +1,5 @@
 'use strict';
 
-exports = module.exports = {
-    getConfig,
-    setConfig,
-
-    verifyPassword,
-    maybeCreateUser,
-
-    supports2FA,
-
-    startSyncer,
-
-    removePrivateFields,
-
-    sync
-};
-
 const assert = require('node:assert'),
     AuditSource = require('./auditsource.js'),
     BoxError = require('./boxerror.js'),
@@ -31,16 +15,17 @@ const assert = require('node:assert'),
     users = require('./users.js'),
     util = require('node:util');
 
-function injectPrivateFields(newConfig, currentConfig) {
-    if (newConfig.bindPassword === constants.SECRET_PLACEHOLDER) newConfig.bindPassword = currentConfig.bindPassword;
-}
-
 function removePrivateFields(ldapConfig) {
     assert.strictEqual(typeof ldapConfig, 'object');
-    if (ldapConfig.bindPassword) ldapConfig.bindPassword = constants.SECRET_PLACEHOLDER;
+    delete ldapConfig.bindPassword;
     return ldapConfig;
 }
 
+
+function injectPrivateFields(newConfig, currentConfig) {
+    if (!Object.hasOwn(newConfig, 'bindPassword')) newConfig.bindPassword = currentConfig.bindPassword;
+}
+
 function translateUser(ldapConfig, ldapUser) {
     assert.strictEqual(typeof ldapConfig, 'object');
 
@@ -60,40 +45,6 @@ function translateUser(ldapConfig, ldapUser) {
     return user;
 }
 
-async function getConfig() {
-    const value = await settings.get(settings.EXTERNAL_LDAP_KEY);
-    if (value === null) return { provider: 'noop', autoCreate: false };
-
-    const config = JSON.parse(value);
-    if (!config.autoCreate) config.autoCreate = false; // ensure new keys
-    return config;
-}
-
-async function setConfig(newConfig, auditSource) {
-    assert.strictEqual(typeof newConfig, 'object');
-    assert(auditSource && typeof auditSource === 'object');
-
-    if (constants.DEMO) throw new BoxError(BoxError.BAD_STATE, 'Not allowed in demo mode');
-
-    const currentConfig = await getConfig();
-
-    injectPrivateFields(newConfig, currentConfig);
-
-    const error = await testConfig(newConfig);
-    if (error) throw error;
-
-    await settings.setJson(settings.EXTERNAL_LDAP_KEY, newConfig);
-
-    if (newConfig.provider === 'noop') {
-        await users.resetSources(); // otherwise, the owner could be 'ldap' source and lock themselves out
-        await groups.resetSources();
-    }
-
-    await eventlog.add(eventlog.ACTION_EXTERNAL_LDAP_CONFIGURE, auditSource, { oldConfig: removePrivateFields(currentConfig), config: removePrivateFields(newConfig) });
-
-    await cron.handleExternalLdapChanged(newConfig);
-}
-
 function supports2FA(config) {
     return config.provider === 'cloudron';
 }
@@ -302,6 +253,40 @@ async function testConfig(config) {
     return null;
 }
 
+async function getConfig() {
+    const value = await settings.get(settings.EXTERNAL_LDAP_KEY);
+    if (value === null) return { provider: 'noop', autoCreate: false };
+
+    const config = JSON.parse(value);
+    if (!config.autoCreate) config.autoCreate = false; // ensure new keys
+    return config;
+}
+
+async function setConfig(newConfig, auditSource) {
+    assert.strictEqual(typeof newConfig, 'object');
+    assert(auditSource && typeof auditSource === 'object');
+
+    if (constants.DEMO) throw new BoxError(BoxError.BAD_STATE, 'Not allowed in demo mode');
+
+    const currentConfig = await getConfig();
+
+    injectPrivateFields(newConfig, currentConfig);
+
+    const error = await testConfig(newConfig);
+    if (error) throw error;
+
+    await settings.setJson(settings.EXTERNAL_LDAP_KEY, newConfig);
+
+    if (newConfig.provider === 'noop') {
+        await users.resetSources(); // otherwise, the owner could be 'ldap' source and lock themselves out
+        await groups.resetSources();
+    }
+
+    await eventlog.add(eventlog.ACTION_EXTERNAL_LDAP_CONFIGURE, auditSource, { oldConfig: removePrivateFields(currentConfig), config: removePrivateFields(newConfig) });
+
+    await cron.handleExternalLdapChanged(newConfig);
+}
+
 async function maybeCreateUser(identifier) {
     assert.strictEqual(typeof identifier, 'string');
 
@@ -537,3 +522,19 @@ async function sync(progressCallback) {
 
     debug('sync: done');
 }
+
+exports = module.exports = {
+    getConfig,
+    setConfig,
+
+    verifyPassword,
+    maybeCreateUser,
+
+    supports2FA,
+
+    startSyncer,
+
+    removePrivateFields,
+
+    sync
+};