Error: Unable to get property 'style' of undefined or null reference

[maxdatalivecom]

Here is the code:
@model IEnumerable<Vidly.Models.Movie>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}

Movies

@Html.ActionLink("New Movie", "New", "Movies", null, new { @Class = "btn btn-primary" })

Movie	Genre

@section scripts
{
<script>
$(document).ready(function () {
var table = $("#movies").DataTable({
ajax: {
url: "/api/movies",
dataSrc: ""
},
columns: [
{
data: "Name",
render: function (data, type, customer) {
return "" + customer.Name + "";
}
},
{
data: "Genre.Name"
},
{
data: "Id",
render: function (data) {
return "Delete";
}
}
]
});

        $("#movies").on("click", ".js-delete", function () {
            var button = $(this);

            bootbox.confirm("Are you sure you want to delete this movie?", function (result) {
                if (result) {
                    $.ajax({
                        url: "/api/movies/" + button.attr("data-movie-id"),
                        method: "DELETE",
                        success: function () {
                            table.row(button.parents("tr")).remove().draw();
                        }
                    });
                }
            });
        });
    });
</script>
@Scripts.Render("~/bundles/jqueryval")

}

IE11 give an error: "Unhandled exception at line 4255, column 5 in http://localhost:59205/Scripts/DataTables/jquery.dataTables.js
0x800a138f - JavaScript runtime error: Unable to get property 'style' of undefined or null reference occurred"
Chrome doesn't return any values on movies.
This is when I call /api/movies
http://localhost:59205/api/movies


2020-04-23T00:00:00

1
Action

1
1
Die Hard
5
2020-04-23T00:00:00


2020-04-23T00:00:00

4
Comedy

4
2
Over Board
3
2020-04-23T00:00:00

[maxdatalivecom]

I found the problem