diff --git a/resources/assets/js/views/settings/settings.js b/resources/assets/js/views/settings/settings.js
index 91d400ee9..b7c218850 100644
--- a/resources/assets/js/views/settings/settings.js
+++ b/resources/assets/js/views/settings/settings.js
@@ -30,5 +30,21 @@ const app = new Vue({
             form: new Form('setting'),
             bulk_action: new BulkAction('settings')
         }
+    },
+
+    methods: {
+        onProtocolChange(protocol) {
+            if (protocol === 'smtp') {
+                document.getElementById('smtp_host').disabled = false
+                document.getElementById('smtp_port').disabled = false
+                document.getElementById('smtp_username').disabled = false
+                document.getElementById('smtp_password').disabled = false
+            } else {
+                document.getElementById('smtp_host').disabled = true
+                document.getElementById('smtp_port').disabled = true
+                document.getElementById('smtp_username').disabled = true
+                document.getElementById('smtp_password').disabled = true
+            }
+        }
     }
 });
diff --git a/resources/views/settings/email/edit.blade.php b/resources/views/settings/email/edit.blade.php
index bc43d5da4..e2ca24dd2 100644
--- a/resources/views/settings/email/edit.blade.php
+++ b/resources/views/settings/email/edit.blade.php
@@ -252,7 +252,7 @@
                     <div id="collapse10" class="collapse hide" aria-labelledby="heading10" data-parent="#accordion10">
                         <div class="card-body">
                             <div class="row">
-                                {{ Form::selectGroup('protocol', trans('settings.email.protocol'), 'share', $email_protocols, !empty($setting['protocol']) ? $setting['protocol'] : null, []) }}
+                                {{ Form::selectGroup('protocol', trans('settings.email.protocol'), 'share', $email_protocols, !empty($setting['protocol']) ? $setting['protocol'] : null, ['change' => 'onProtocolChange']) }}
 
                                 {{ Form::textGroup('sendmail_path', trans('settings.email.sendmail_path'), 'road', [':disabled' => '(form.protocol == "smtp") || (form.protocol != "sendmail") ? true : false']) }}