Laravel route not working when posting data via JQuery

Question

I'm trying to validate my form with jquery. When submitting, Laravel can't find the route in web.php. When I previous did it with just model::Form, it worked.. Did tried a lot of things but none gave me a solution

EDIT: 419 execption is gone: facing 500 internal error now

web.php:

Route::post('/profile/sendmail', 'VendorController@send_mail')->name('profile.sendmail');

VendorController:

public function send_mail(Request $request){
        dd("test");
    }

contact.blade.php

<div class="events single-event">
    <div class="o-grid">
        <div class="o-grid__col u-6/12">
            <div class="o-grid__col u-12/12@sm">
                <h4>@lang('profile.contactTitle')</h4>
            </div>


            <div class="o-grid__col u-12/12@sm" id="alert_modal" style="margin-top: 150px; display: none">
                <div class="modal-body">
                    <h3>Alert</h3>
                    <h5 id="alert_message"></h5>
                </div>
                <input type="hidden" id="profile_id" value="{{ $profile->id }}">
            </div>


            <div class="o-grid__col u-12/12@sm">
                {!! Form::label('', __('profile.contactSalutation').'*') !!}
                @if( Session::get('urlLang') == "en" )
                    {!! Form::select(__('contact_contactSalutation'), array('Miss' => 'Miss', 'Sir' => 'Sir'),array('class' => 'c-dropdown c-dropdown__simple u-mb-x6'),['required' => 'required']) !!}
                @else
                    {!! Form::select(__('contact_contactSalutation'), array('Frau' => 'Frau', 'Herr' => 'Herr'),array('class' => 'c-dropdown c-dropdown__simple u-mb-x6'),['required' => 'required']) !!}
                @endif
            </div>
            <br>
        </div>
        <div class="o-grid__col u-6/12">
            <div class="o-grid__col u-12/12@sm">
                <p style="color: #696978; font-size: 14px; text-align: right">@lang('profile.mandatoryField')</p>
            </div>
        </div>
    </div>
    <div class="o-grid">
        <div class="o-grid__col u-6/12">
            <div class="o-grid__col u-12/12@sm">
                {!! Form::label('contact_first_name', __('profile.contactFirstName').'*') !!}
                {!! Form::text('contact_first_name', null, ['placeholder' => __('profile.contactFirstName'),'class' => 'c-input required','id' => 'contact_first_name','required']) !!}
            </div>
            <div class="o-grid__col u-12/12@sm">
                {!! Form::label('contact_e_mail', __('profile.contactEmail').'*') !!}
                {!! Form::text('contact_e_mail', null, ['placeholder' => __('profile.contactEmail'),'class' => 'c-input required email','id' => 'contact_e_mail','required']) !!}
                <span class="text-danger">{{ $errors->first('contact_e_mail') }}</span>
            </div>
        </div>
        <div class="o-grid__col u-6/12">
            <div class="o-grid__col u-12/12@sm">
                {!! Form::label('contact_last_name', __('profile.contactLastName').'*') !!}
                {!! Form::text('contact_last_name', null, ['placeholder' => __('profile.contactLastName'),'class' => 'c-input required','id' => 'contact_last_name','required']) !!}
            </div>
            <div class="o-grid__col u-12/12@sm">
                {!! Form::label('contact_phone', __('profile.contactPhone')) !!}
                {!! Form::text('contact_phone', null, ['placeholder' => __('profile.contactPhone'),'class' => 'c-input','id' => 'contact_phone']) !!}
            </div>
        </div>

        <div class="o-grid__col u-12/12">
            <div class="o-grid__col">
                {!! Form::label('text', __('profile.contactMessageInfo')) !!}
                {!! Form::textarea('contact_text',null,['class' => 'c-input c-input__text required','placeholder' => __('profile.contactMessageInfo'),'id' => 'contact_text','required']) !!}
            </div>
        </div>

        <div class="o-grid__col u-12/12">
            <input class="c-input__checkbox required" id="toc" type="checkbox" name="agree_to_toc" value="1" required>
            <label class="c-input__checkboxLabel p2" for="toc">
                {!! @trans('global.formTacInfo', [
                    'class' => 'c-link c-link__primary',
                    'link_datenschutz' => route('static.show', ['folder_id' => 28, 'slug' => "datenschutz"])
                    ]) !!}</label>
        </div>

        <div class="o-grid__col u-text-right">
            <button id="submit_contact_form" class="c-btn c-btn--small c-btn--red" type="submit" style="display: none" onclick="submitForm()">
                <span>@lang('profile.contactSendMessage')</span></button>
        </div>
    </div>
</div>

<script>
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    $('#toc').change(function() {
        if($(this).is(":checked")) {
            $('#submit_contact_form').show();
        }
        else{
            $('#submit_contact_form').hide();
        }
    })

    function submitForm() {
        var profile_id = $("#profile_id").val();
        $.ajax({
            method: 'POST',
            url: '{{route("profile.sendmail")}}',
            data: {profile_id: profile_id},
            dataType: "json",
            success: function(data){
                $('#alert_message').text(data.message);
                $('#alert_modal').show();
            },
            error: function(data){
                $('#alert_message').text(data.message);
                $('#alert_modal').show();
            }
        });
    }
</script>

Alberto Guilherme · Accepted Answer · 2019-03-07 14:11:50Z

2

The 419 status is usualy related to token problems.

try changing the '_token'

to this:

headers: {
    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  }

answered Mar 7, 2019 at 14:11

Alberto Guilherme

3582 silver badges13 bronze badges

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

8 Comments

iuuujkl Over a year ago

Yes, that's something I saw a lot, but then I get: VM322:14 Uncaught SyntaxError: Unexpected token : at m (jquery.min.js:2) at Re (jquery.min.js:2) at w.fn.init.append (jquery.min.js:2) at w.fn.init.<anonymous> (jquery.min.js:2) at z (jquery.min.js:2) at w.fn.init.html (jquery.min.js:2) at Object.success (contact-provider.js:19) at u (jquery.min.js:2) at Object.fireWith [as resolveWith] (jquery.min.js:2) at k (jquery.min.js:2)

Alberto Guilherme Over a year ago

@belgiums , Could you not minify your js and show where the error is reported? In what exat line.

iuuujkl Over a year ago

you mean jquery.min.js? it's just the basic js file? my own js is at the question

JoaoGRRR Over a year ago

On ajax request: headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },

iuuujkl Over a year ago

the 419 error is gone. I put it as first js script: $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); now having a 500 exception. Trying to solve it :)

|

JoaoGRRR · Accepted Answer · 2019-03-07 14:27:04Z

2

On your post route you dont need to pass variables in the URL:

Change your route to:

Route::post('/profile/sendmail', 'VendorController@send_mail')->name('profile.sendmail');

And the ajax request:

    $.ajax({
                    method: 'POST',
                    headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    url: '{{route("profile.sendmail")}}',
                    data: {profile_id_var: profile_id_var},

On your controller:

$request->get('profile_id_var');

edited Mar 7, 2019 at 14:27

answered Mar 7, 2019 at 14:06

JoaoGRRR

3152 silver badges9 bronze badges

10 Comments

iuuujkl Over a year ago

That helped a bit, in my header he now gives "profile_id => 409" (409 =the number). But still get the 419 status.. thanks!

JoaoGRRR Over a year ago

Is not reaching the controller? Check the 'send_mail()' function

iuuujkl Over a year ago

no.. first line is a dd("test"). This is him: public function send_mail(Request $request,VendorProfile $profile_id){ dd("f"); }

JoaoGRRR Over a year ago

Try it send_mail(Request $request){ dd("f"); }

iuuujkl Over a year ago

419 is now gone due to the x-csrf header. I tried the controller as well, now having a 500 internal error..

|

Kévin Bibollet · Accepted Answer · 2019-03-07 14:06:22Z

0

I think your line data: profile_id_var is not right as you defined your route with a profile_id parameter (and not profile_id_var).

What if you try data: { profile_id: profile_id_var }?

answered Mar 7, 2019 at 14:06

Kévin Bibollet

3,6331 gold badge17 silver badges34 bronze badges

Comments

Roman · Accepted Answer · 2021-09-28 12:26:43Z

0

$.ajax({
      url: '/post-comments',// the right way;
      url: 'post-comments' // the wrong way because its call the route when we are and not the route when we need to send.

edited Sep 28, 2021 at 12:26

Roman

2,5592 gold badges31 silver badges53 bronze badges

answered Sep 27, 2021 at 13:31

Besnik Piliqi

1

Collectives™ on Stack Overflow

Laravel route not working when posting data via JQuery

4 Answers 4

8 Comments

10 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

8 Comments

10 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related