diff --git a/app/views/sms_settings/index.html.erb b/app/views/sms_settings/index.html.erb
index 0b3b5907..72fecae2 100644
--- a/app/views/sms_settings/index.html.erb
+++ b/app/views/sms_settings/index.html.erb
@@ -63,8 +63,7 @@
                         Sms::SUPPORTED_PROVIDERS.map { |p| [provider_labels[p] || p, p] },
                         { selected: selected_provider },
                         class: 'base-select',
-                        id: 'sms_provider_select',
-                        onchange: 'var s=this,v=s.value;document.querySelectorAll("[data-provider-block]").forEach(function(b){b.classList.toggle("hidden",b.dataset.providerBlock!==v)})' %>
+                        id: 'sms_provider_select' %>
         </div>
 
         <div data-provider-block="bulkvs" class="space-y-4<%= ' hidden' unless selected_provider == 'bulkvs' %>">
@@ -186,3 +185,18 @@
   <div class="w-0 md:w-52"></div>
 </div>
 
+<script>
+(function() {
+  var select = document.getElementById('sms_provider_select');
+  if (!select) return;
+  function sync() {
+    var v = select.value;
+    document.querySelectorAll('[data-provider-block]').forEach(function(b) {
+      b.classList.toggle('hidden', b.dataset.providerBlock !== v);
+    });
+  }
+  select.addEventListener('change', sync);
+  sync();
+})();
+</script>
+