turn bootstrap button into link with javascript and ajax

Question

I have a bootstrap button, that i have embedded into a form. The form requests a php file with ajax. But i Cant get the button to work like a link?

The html code is for the bootstrap button is :

<a id="btn-login" href="#" class="btn btn-success">Login</a>

and the js is :

<script>
$(document).ready(function() {
    $('.myform').on('submit',function(){
         
        // Add text 'loading...' right after clicking on the submit button. 
        $('.output_message').text('Loading...'); 
         
        var form = $(this);
        $.ajax({
            url: form.attr('action'),
            method: form.attr('method'),
            data: form.serialize(),
            success: function(result){
                if (result == 'success'){
                    $('.output_message').text('Message Sent!');  
                } else {
                    $('.output_message').text('Error Sending email!');
                }
            }
        });
         
        // Prevents default submission of the form after clicking on the submit button. 
        return false;   
    });
});
</script>

gerrit · Accepted Answer · 2017-03-07 20:56:08Z

1

So do I get that correct that the link is supposed to send the form? That will not work, as a link on its own is not able to trigger a submit. You need an input of type submit.

<input type="submit" class="btn btn-success" value="Login">

answered Mar 7, 2017 at 20:56

gerrit

4314 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

turn bootstrap button into link with javascript and ajax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related