how to use ajax for auto refresh my page in laravel 7 framework

Question

i use this code in content.blade.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js" type="text/javascript"></script>
                <script type="text/javascript">
                    var auto_refresh = setInterval(
                        function () {
                            $('#load_content').load('/like').fadeIn("slow");
                        }, 10000);
                </script>


<div id="load_content"></div>

in my routes, web.php i put this code

Route::get('/like', function(){
    return view('likes');
}); 

and this is likes.blade.php

@if (Route::has('login'))


                <?php 

                 $id = auth()->user()->id;
                 $like = Like::find($id);
                 if ($like == null)
                {

                ?>


 <button type="button" class="btn btn-default btn-sm"><i class="far fa-thumbs-up"></i> Like</button>
                <?php } 
                else { ?>
                 <button type="button" class="btn btn-default btn-sm"><i class="far fa-thumbs-down"></i> Dislike</button>
                <?php } ?>
 @endif

but when i run this code with artisan serve nothing has changed in my page. i dont know how to use ajax in my code, where is the load page should i put in my ajax script?

Answer 1

You should use axios or ajax to request data from /like url and setTimeInterval to run on every defined time and load updated content

Answer 2

This is how a good ajax call could look like for you.

$.ajax({
    url: '/like',
    type: 'get',
    success:function(data){
      //your desired code here
      $('#load_content').fadeIn("slow");
    }

})