diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tutorials/LoginAndRegister/Template5.razor.js b/src/BootstrapBlazor.Server/Components/Samples/Tutorials/LoginAndRegister/Template5.razor.js
index fff9f841c42..bfdd01fbf71 100644
--- a/src/BootstrapBlazor.Server/Components/Samples/Tutorials/LoginAndRegister/Template5.razor.js
+++ b/src/BootstrapBlazor.Server/Components/Samples/Tutorials/LoginAndRegister/Template5.razor.js
@@ -4,6 +4,11 @@
         const email = el.querySelector('.login-item-email');
         if (email) {
             email.classList.add('show');
+            const input = email.querySelector('.input');
+            if (input) {
+                input.focus();
+                input.select();
+            }
         }
     }
 }
@@ -23,6 +28,11 @@ export function go(id) {
             password.classList.add('show');
             password.classList.add('animate-fade-in')
             password.classList.remove('animate-fade-out')
+            const input = password.querySelector('.input');
+            if (input) {
+                input.focus();
+                input.select();
+            }
         }
     }
 }
@@ -35,6 +45,11 @@ export function back(id) {
             email.classList.add('show');
             email.classList.remove('animate-fade-out');
             email.classList.add('animate-fade-in');
+            const input = email.querySelector('.input');
+            if (input) {
+                input.focus();
+                input.select();
+            }
         }
 
         const password = el.querySelector('.login-item-password');