JQuery - preventing form from submitting not working

Asked Jun 14 '20 at 18:19

Active Jul 06 '20 at 09:41

Viewed 39 times

I create a form.

How do I prevent a form from submitting using jQuery?

<form id="form">
  <div class="container form-group">
    <h1 class="mb-5">Get in touch!</h1>
    <div id="error"></div>
    <label for="email">Email Address:</label>
    <input type="email" name="email" class="form-control" id="email" />
    <small class="text-muted d-block mb-3">we never share your email</small>
    <label>Subject:</label>
    <input type="text" name="text" class="form-control mb-3" id="subject" />
    <label for="message">Message:</label>
    <textarea
      name="message"
      id="content"
      rows="3"
      class="form-control mb-3"
    ></textarea>
    <button type="submit" class="btn btn-primary" id="submit">Submit</button>
  </div>
</form>

This is my jQuery code:

$(document).ready(function () {
  $("#form").submit(function (e) {
    e.preventDefault();
  });
});

Unfortunately, the page refreshes again

I don't know where the problem comes from

edited Jul 06 '20 at 09:41

marc_s

732,580
175
1,330
1,459

asked Jun 14 '20 at 18:19

mohammad erfan

1

What you've written should work. – Barmar Jun 14 '20 at 18:20
1

Is the form added to the DOM dynamically? See https://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements – Barmar Jun 14 '20 at 18:21
1

Have you checked for any error messages on the console? – Mario Jun 14 '20 at 18:29
there is no error in consoleو The page is refreshed each time – mohammad erfan Jun 14 '20 at 18:31
Then, all else being equal, that should work. You need to provide a [mcve] – Quentin Jun 14 '20 at 18:31
Note that some of your labels are missing their `for` attributes and others are referencing the `name` of their target when they need to reference the `id`. – Quentin Jun 14 '20 at 18:32
I have tested your code in my local and it works as expected, when the form is sent `preventDefault()` does its job. – Mario Jun 14 '20 at 18:38
So why doesn't it work for me? – mohammad erfan Jun 14 '20 at 19:03
Please see the answer and the working demo link added for you. – Always Helping Jun 14 '20 at 21:32

JQuery - preventing form from submitting not working

0 Answers0