I'm having an issue with my contact form. Sometimes it works and submits the form data, but other times it doesn't respond at all. The form is visible on the page, but clicking the submit button doesn't trigger any action, and the form doesn't submit the data.
I am using Formspree to handle the submission, but there are no error messages in the console, and the form seems to work intermittently.
Here is my form code:
<form id="contactForm" class="footer-form" action="; method="POST">
<p class="footer-list-title">Contact Us</p>
<div class="input-wrapper">
<label for="full_name">Full Name</label>
<input type="text" name="full_name" id="full_name" required placeholder="Full Name" aria-label="Your Name" class="input-field">
</div>
<div class="input-wrapper">
<label for="email_address">Email</label>
<input type="email" name="email_address" id="email_address" required placeholder="Email" aria-label="Email" class="input-field">
</div>
<div class="input-wrapper">
<label for="phone_number">Phone Number</label>
<input type="tel" name="phone_number" id="phone_number" placeholder="Phone Number" aria-label="Phone" class="input-field">
</div>
<div class="input-wrapper">
<label for="message">Message</label>
<textarea name="message" id="message" required placeholder="Message" aria-label="Message" class="input-field"></textarea>
</div>
<button type="submit" class="btn">Send Message</button>
<p id="responseMessage" style="color: green; display: none;">Message sent successfully!</p>
</form>