Update static/usage/v8/toggle/helper-error/demo.html

thetaPC · brandyscarney · web-flow · commit 927c64f7da57 · 2025-03-11T11:27:33.000-07:00
Co-authored-by: Brandy Smith &lt;brandyscarney@users.noreply.github.com&gt;
diff --git a/static/usage/v8/toggle/helper-error/demo.html b/static/usage/v8/toggle/helper-error/demo.html
@@ -17,21 +17,19 @@
   </head>
 
   <body>
-    <div class="container">
-      <form id="my-form">
-        <ion-toggle helper-text="This needs to be enabled" error-text="This field is required"> Wi-Fi </ion-toggle>
-
-        <br />
+    <style>
+      ion-toggle {
+        width: 300px;
+      }
+    </style>
 
-        <ion-button type="submit" size="small">Submit</ion-button>
-      </form>
+    <div class="container">
+      <ion-toggle helper-text="Enable to connect to available networks" error-text="Must be enabled to access the internet" checked> Wi-Fi </ion-toggle>
     </div>
 
     <script>
-      const form = document.getElementById('my-form');
-      const wifi = form.querySelector('ion-toggle');
+      const wifi = document.querySelector('ion-toggle');
 
-      form.addEventListener('submit', (event) => submit(event));
       wifi.addEventListener('ionChange', (event) => validateToggle(event));
 
       const validateToggle = (event) => {
@@ -45,12 +43,6 @@
           wifi.classList.add('ion-valid');
         }
       };
-
-      const submit = (event) => {
-        event.preventDefault();
-
-        validateToggle({ detail: { checked: wifi.checked } });
-      };
     </script>
   </body>
 </html>
