A Beginner Question about Javascript/Ajax Problem

I am learning Asp.Net Core 3.0, and I am practicing with some code from a teacher over at Udemy, but something isn't working right.

I have a controller with a method called "GetAll()". It gets data from the DB and displays to the view when it's loaded.

Trouble is, the data is not loading at all. The instructor told me something is wrong with the javascript file, but I'm not convinced.

If you could just quickly look at the file and tell me if it looks right to you, then I'll accept that.

In short, the controller loads the view, the view has "/js/categories.js" as a reference, and upon loading is supposed to run the GetAll()

method in the controller. Do you see anything in the javascript file below that might look wrong?

Or, is there supposed to be some fancy library that I should load to use javascript with ajax?

Here's the script contents for categories.js:

var dataTable;

$(document).ready(function () {
loadDataTable();
});

function loadDataTable() {

dataTable = $('#tblData').DataTable({
"ajax": {
"url": "/admin/Categories/GetAll",
"type": "GET",
"datatype": "json"
},
"columns": [
{ "data": "name", "width": "50%" },
{ "data": "displayOrder", "width": "20%" },
{
"data": "id",
"render": function (data) {
return `<div class="text-center">
<a href="/Admin/Categories/Upsert/${data}" class='btn btn-success text-white' style='cursor:pointer; width:100px;'>
<i class='far fa-edit'></i> Edit
</a>
&nbsp;
<a onclick=Delete("/Admin/Categories/Delete/${data}") class='btn btn-danger text-white' style='cursor:pointer; width:100px;'>
<i class='far fa-trash-alt'></i> Delete
</a>
</div>
`;
}, "width": "30%"
}
],
"language": {
"emptyTable":"No records found."
},
"width":"100%"
});
}