Simplify references

diff --git a/index.html b/index.html
index b25d4a66804f7e0ff18f698c0865251cb3aaa964..556e036eb179dc39f2d53075413314b4b252448c 100644 (file)
--- a/index.html
+++ b/index.html
@@ -55,7 +55,7 @@
     <a href="https://github.com/ardislu/google-forms-frontend">
       <svg role="img" aria-labelledby="github" width="24" height="24" viewBox="0 0 24 24">
         <title id="github">GitHub repository</title>
-        <path d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33c.85 0 1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2z"/>
+        <path d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33c.85 0 1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2z" />
       </svg>
     </a>
   </header>
@@ -84,17 +84,13 @@
       <label for="entry.1500214518">Time:</label>
       <input type="time" name="entry.1500214518">
 
-      <button type="submit">Submit</button>
-      <output></output>
+      <button type="submit" name="submit">Submit</button>
+      <output name="status"></output>
     </form>
   </main>
 
   <script>
-    const form = document.querySelector('form');
-    const button = document.querySelector('button');
-    const output = document.querySelector('output');
-
-    form.addEventListener('submit', async event => {
+    document.querySelector('form').addEventListener('submit', async event => {
       event.preventDefault();
 
       const data = new FormData(event.target);
@@ -111,10 +107,10 @@
       params.set('entry.1500214518_hour', timeValue.getUTCHours().toString().padStart(2, '0')); // Google Forms requires 2 digits, but getHours does not include leading 0
       params.set('entry.1500214518_minute', timeValue.getUTCMinutes().toString().padStart(2, '0')); // Google Forms requires 2 digits, but getMinutes does not include leading 0
 
-      await fetch(form.action, { method: 'POST', body: params, mode: 'no-cors' }); // Can't set CORS headers for Google Forms, so can't access the Response. But Request will still be sent.
-      button.disabled = true;
-      output.textContent = '✔ Form submitted!' // Assume the response was successful
-    })
+      await fetch(event.target.action, { method: 'POST', body: params, mode: 'no-cors' }); // Can't set CORS headers for Google Forms, so can't access the Response. But Request will still be sent.
+      event.target.elements['submit'].disabled = true;
+      event.target.elements['status'].textContent = '✔ Form submitted!'; // Assume the response was successful
+    });
   </script>
 </body>