Vfrdtyky

I am trying everything to make my webpage smoother. The thing is, I've tried to make a JQuery submit and now, the button does not do anything when pressed.

Here is my code:

The form:

<form id="myForm">

    <div class="author-thumb">

        <img src="{{ Auth::user()->getFirstMediaUrl('pps') ? Auth::user()->getFirstMediaUrl('pps')  : '/img/ava_10.jpg' }}" width="36" height="36" alt="author">

    </div>

    <div class="form-group with-icon label-floating is-empty">

        <label class="control-label">Share what you are thinking here...</label>

        <textarea class="form-control" name="content" id="content" required></textarea>

    </div>

    <div class="add-options-message">

        <a href="#" class="options-message" data-toggle="tooltip" data-placement="top"   data-original-title="ADD PHOTOS">

            <svg class="olymp-camera-icon" data-toggle="modal" data-target="#update-header-photo"><use xlink:href="icons/icons.svg#olymp-camera-icon"></use></svg>

        </a>

        <button class="btn btn-primary btn-md-2" id="ajaxSubmit">Post</button>

    </div>

</form>

The controller:

public function store(Request $request)

{

    $post = new Post();

    $post->user_id = Auth::user()->id;

    $post->username = Auth::user()->username;

    $post->author = Auth::user()->name;

    $post->content = $request->content;

    $post->save();

    return response()->json(['success'=>'Data is successfully added']);

}

The route:

Route::post('/post', [



'uses' => 'PostController@store',



]);

The JQuery:

<script type="text/javascript">



jQuery(document).ready(function(){

        jQuery('#ajaxSubmit').click(function(e){

           e.preventDefault();

           $.ajaxSetup({

              headers: {

                  'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')

              }

          });

           jQuery.ajax({

              url: "{{ url('/post') }}",

              method: 'post',

              data: {

                 content: jQuery('#content').val()

              },

              success: function(result){

                 console.log(result);

              }});

           });

        });



</script>

Can someone please help me with this? Please explain to me which part of the code is wrong and what I can do to avoid making the same mistake again. Thanks in advance for your time.

the solution was the following one:

<script type="text/javascript">



jQuery(document).ready(function(){

        jQuery('#ajaxSubmit').click(function(e){

           $.ajaxSetup({

              headers: {

                  'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')

              }

          });

           jQuery.ajax({

              url: "{{ url('/post') }}",

              method: 'post',

              data: {

                 _token: '{{csrf_token()}}', <-- ADD THIS LINE!

                 content: jQuery('#content').val()

              },

              success: function(result){

                 console.log(result);

              }});

           });

        });



</script>