diff --git a/assets/js/pages/providers.js b/assets/js/pages/providers.js
index fc9f4270..c686e58b 100755
--- a/assets/js/pages/providers.js
+++ b/assets/js/pages/providers.js
@@ -569,6 +569,8 @@ App.Pages.Providers = (function () {
         addEventListeners();
 
         vars('services').forEach((service) => {
+            const checkboxId = `provider-service-${service.id}`; 
+            
             $('<div/>', {
                 'class': 'checkbox',
                 'html': [
@@ -576,6 +578,7 @@ App.Pages.Providers = (function () {
                         'class': 'checkbox form-check',
                         'html': [
                             $('<input/>', {
+                                'id': checkboxId,
                                 'class': 'form-check-input',
                                 'type': 'checkbox',
                                 'data-id': service.id,
@@ -586,7 +589,7 @@ App.Pages.Providers = (function () {
                             $('<label/>', {
                                 'class': 'form-check-label',
                                 'text': service.name,
-                                'for': service.id
+                                'for': checkboxId,
                             })
                         ]
                     })
diff --git a/assets/js/pages/secretaries.js b/assets/js/pages/secretaries.js
index 2b711da6..44654850 100644
--- a/assets/js/pages/secretaries.js
+++ b/assets/js/pages/secretaries.js
@@ -493,7 +493,13 @@ App.Pages.Secretaries = (function () {
      * Initialize the module.
      */
     function initialize() {
+        resetForm();
+        filter('');
+        addEventListeners();
+
         vars('providers').forEach((provider) => {
+            const checkboxId = `provider-service-${provider.id}`;
+          
             $('<div/>', {
                 'class': 'checkbox',
                 'html': [
@@ -501,24 +507,24 @@ App.Pages.Secretaries = (function () {
                         'class': 'checkbox form-check',
                         'html': [
                             $('<input/>', {
+                                'id': checkboxId,
                                 'class': 'form-check-input',
                                 'type': 'checkbox',
-                                'data-id': provider.id
+                                'data-id': provider.id,
+                                'prop': {
+                                    'disabled': true,
+                                }
                             }),
                             $('<label/>', {
                                 'class': 'form-check-label',
                                 'text': provider.first_name + ' ' + provider.last_name,
-                                'for': provider.id
+                                'for': checkboxId,
                             })
                         ]
                     })
                 ]
             }).appendTo('#secretary-providers');
         });
-        
-        resetForm();
-        filter('');
-        addEventListeners();
     }
 
     document.addEventListener('DOMContentLoaded', initialize);