title: Form data is not uploaded and alert not working
body: <p>I'm new to Javascript and followed a tutorial to make a pop form. The data filled by the user was supposed to appear in the console and that doesn't happen. I would also like to create an alert for when people click on the submit button so I added the last few lines that you'll see in the JavaScipt code, but it's not working as well. Hope that this is detailed enough and that someone can help me.</p>
  <p>Here is the HTML</p>
  <pre><code>&lt;h1&gt;
                  I'd love to chat with you about your upcoming project.
                &lt;/h1&gt;
                &lt;div class=&quot;intro-text&quot;&gt;
                  Fill out the form bellow to get in touch. Either for a budget information or to book a meeting to discuss
                  any ideas that you might have, you can contact me for any
                  clarification you need. I'll get back to you in 2-3 days.
                &lt;/div&gt;
                &lt;div class=&quot;row open-form&quot;&gt;
                  &lt;div class=&quot;open-btn&quot;&gt;
                    &lt;button id=&quot;show-modal&quot;&gt;&lt;strong&gt;Open Form&lt;/strong&gt;&lt;/button&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
  &lt;script src=&quot;./JavaScript/action_page.js&quot;&gt;&lt;/script&gt;
      &lt;div class=&quot;modal modal--hidden&quot;&gt;
        &lt;div class=&quot;modal_content&quot;&gt;
          &lt;div class=&quot;close&quot;&gt;
            &lt;i class=&quot;fas fa-times&quot; onclick=&quot;closeMe()&quot;&gt;&lt;/i&gt;
          &lt;/div&gt;
          &lt;h1&gt;Ask away&lt;/h1&gt;
          &lt;form id=&quot;submit&quot;&gt;
            &lt;input type=&quot;text&quot; placeholder=&quot;Name&quot; name=&quot;name&quot; /&gt;
            &lt;input type=&quot;email&quot; id=&quot;email&quot; placeholder=&quot;Email&quot; name=&quot;email&quot;/&gt;
            &lt;input type=&quot;text&quot; placeholder=&quot;Subject&quot; name=&quot;subject&quot; /&gt;
            &lt;textarea placeholder=&quot;Message&quot; name=&quot;message&quot;&gt;&lt;/textarea&gt;
            &lt;button class=&quot;submit&quot;&gt;Submit&lt;/button&gt;
          &lt;/form&gt;
       &lt;/div&gt;
     &lt;/div&gt;
  </code></pre>
  <p>And JavaScript</p>
  <pre><code>document.getElementById(&quot;show-modal&quot;).addEventListener(&quot;click&quot;, function() {
    document.querySelector(&quot;.modal&quot;).style.display = &quot;flex&quot;;
  });
  
  function closeMe() {
    document.querySelector(&quot;.modal&quot;).style.display = &quot;none&quot;;
  }
  
  document.querySelector(&quot;#show-modal&quot;).addEventListener(&quot;submit&quot;, event =&gt; {
    event.preventDefault();
    toggleModal();
    let formData = new FormData(document.querySelector(&quot;#show-modal&quot;));
    console.log(
      &quot;Name:&quot; + formData.get(&quot;name&quot;),
      &quot;Email:&quot; + formData.get(&quot;email&quot;),
      &quot;Subject:&quot; + formData.get(&quot;subject&quot;),
      &quot;Message:&quot; + formData.get(&quot;message&quot;)
    );
  });
  
  document.getElementById(&quot;#show-modal&quot;).addEventListener(&quot;submit&quot;, function() {
    alert(&quot;Thank you for your message!&quot;);
  });
  </code></pre>
  <p>Here is the page if you want to have a look: <a href="https://giacomosorbi.github.io/joanaoli09-module-i/contact.html" rel="nofollow noreferrer">https://giacomosorbi.github.io/joanaoli09-module-i/contact.html</a></p>