CODEWITHSUNDEEP
jqueryajaxlaravelformssubmit
Meoi
Meoi

Reputation: 21

How make "submit" form work from Ajax after push on button

I have form and need use Ajax. All ok when I sent email after push "enter" on keyboard. When I want use "button" in HTML it is does not work. I try use "click" for my button in my JS file but it refresh page and I just get message(customise message) on empty page.

 <form action="{{ route('odh.giftcode.email') }}" id="report"  method="post" name="form" style="text-align:center;">
        {{csrf_field()}}
        <input type="email" id="email" name="email"  class="section1_input" required  pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" placeholder="Đại Hiệp vui lòng để lại Email">

        <span class="section1_message"style="display:block" id="result"> Vui lòng đăng ký = email của bạn để chúng tôi có thể gửi quà về</span>

        <button class="btn btn-outline section1_button" id="submit_form" type ="button" name="submit">
            <img class="" src="{{asset('images/ohdaihiepLandingPage/form/form_button.png')}}" style="width:100%;" alt="">
        </button>
    </form>

And my JS

$(function () {
    $('#report').submit(function (e) {
        e.preventDefault()
        var url = e.target.action
        var formData = $(this).serialize()
        $.post(url, formData, function (response) {
            $('.section1_input').val('');
            var $res=response.message;
            $('#result').text($res);
        });
        $(".section1_message").empty()
    })
})

Upvotes: 0

Views: 95

Answers (1)

SWastik Thapaliya
SWastik Thapaliya

Reputation: 325

Change your button type from button to submit. It should work fine or else change your event trigger to click.

check this for more detail

Upvotes: 2

Related Questions