How to properly load data from a URL with AJAX in Laravel

Question

I want to load the data into the table at the start of the page and after the operations such as create, edit and delete using JQUERY AJAX.

I have CategoryController. In there I have function load() to return JSON data to the view. In blade file, I have ajax function that add new category to the database and it works. What I am getting trouble is loading data from database.

Controller

public function load()
    {
        $categories = Category::all();
        return response()->json($categories);
    }

Route

Route::get('/categories/load', 'CategoryController@load');

JQUERY

function loadCategories() {
            $.ajax({
                url: "/categories/load",
                type: 'GET',
                success: function(data){
                    console.log(data)
                }
            })
        }

Category Model

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Category extends Model
{
    protected $fillable = ['name'];
}

Possible duplicate of [difference between AJAX POST and GET](https://stackoverflow.com/questions/2855467/difference-between-ajax-post-and-get) — Devon Bessemer, Jan 30 '19 at 12:06
You have a post route, you're using a get request. The route should be a get based on you retrieving data, not changing state. I recommend you do some reading on post vs get. — Devon Bessemer, Jan 30 '19 at 12:06
@Devon Thanks for pointing out and suggesting. I have changed to "get" in route but I got no response. — Hein Htet Zor, Jan 30 '19 at 12:11
I doubt it was no response. What was the response's status code? Was it 200, 500, etc. — Devon Bessemer, Jan 30 '19 at 12:13
A 200 response indicates everything went ok. So you must have gotten some response body even if it was an empty array with this load method. If it was an empty array then you don't have any categories.. — Devon Bessemer, Jan 30 '19 at 12:15
@devon I got no response, not even an empty array. Perhaps I have some mistakes in returning JSON data in Controller file. — Hein Htet Zor, Jan 30 '19 at 12:20
Did you check if your `$categories` has data ? with `dd()` for example — Saromase, Jan 30 '19 at 12:27
Try this please : `$categories = Category::all()->toJson();` — Saromase, Jan 30 '19 at 12:36
try to return `return response()->json($categories->toArray());` If it is that, show https://laravel.com/docs/5.7/eloquent-serialization#serializing-models-and-collections — Saromase, Jan 30 '19 at 12:47
Use `Log::info($categories)` to check whether you are getting data from table or not. — Jitendra, Jan 30 '19 at 12:49
Share the event from where ajax is firing! May be there is an issue! — Iftikhar uddin, Jan 30 '19 at 13:12
@Iftikharuddin $(document).ready(function(){ loadCategories() }) — Hein Htet Zor, Jan 30 '19 at 13:15
@Saromase It works with a POST method. I changed it like I did in add Category function except empty data array.And it returns the object as success callback. But shouldn't it be GET ? — Hein Htet Zor, Jan 30 '19 at 13:17
i dont know, i cant try it now, but in the evening i will try it. — Saromase, Jan 30 '19 at 13:29

score 0 · Accepted Answer · answered Jan 30 '19 at 14:42

It should be like that :

//Controller
use App\Category;

...

    public function load()
        {
            return Category::all();
        }

Then, basically it's a GET route, so you don't need AJAX at the moment to test it. You can just introduce in browser localhost:8000/categories/load and should see the JSON result.

How to properly load data from a URL with AJAX in Laravel

1 Answers1