user3844579
user3844579

Reputation: 505

jQuery prevent default not working

I have a simple form in a php file:

<form class='loginForm' id='loginForm'>
    <input type='text' class='form-control' name='username' placeholder='email address'>
    <button class='btn btn-lg btn-primary btn-block' type='submit'>Login</button>
</form>

Im trying to stop the form submission by:

$("#loginForm").on('submit', function (e) {
    e.preventDefault();
});

But its not stopping it, what am i doing wrong?

Thanks

Upvotes: 2

Views: 39

Answers (1)

PeterKA
PeterKA

Reputation: 24638

Use event delegation when attaching events to content that loads after document ready.

$(document).ready(function(){
    $(document).on('submit', "#loginForm", function (e) {
        e.preventDefault();
    });
});
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<form class='loginForm' id='loginForm'>
    <input type='text' class='form-control' name='username' placeholder='email address'>
    <button class='btn btn-lg btn-primary btn-block' type='submit'>Login</button>
</form>

Upvotes: 4

Related Questions