I have a .net core mvc application. In one of my controller action I am getting data from database and display it on datatables.js. The problem is datatables renders after 2-3 seconds. Is there a way to put spinner on the page in order to inform client that
page is not fully ready?
That probably explains why it takes a while. You are generating HTML on the server, sending it to the client, and then getting DataTables to re-render it. It also appears that you are not paging the data on the server. You seem to be getting all data, and
then using Datatables to filter it to only show 25 rows? If that is the case, the browser initially renders every row of data. That takes time. Depending on how many rows of data the view initially returns, it could take a lot of time.
Perhaps you should test getting the data as JSON from the server using an AJAX call, and doing the paging on the server.
Member
527 Points
2729 Posts
How to add loading spinner to a slow loading page?
Sep 11, 2019 12:24 PM|cenk1536|LINK
Hi,
I have a .net core mvc application. In one of my controller action I am getting data from database and display it on datatables.js. The problem is datatables renders after 2-3 seconds. Is there a way to put spinner on the page in order to inform client that page is not fully ready?
Here is my cshtml:
Here is my controller action:
All-Star
194524 Points
28081 Posts
Moderator
Re: How to add loading spinner to a slow loading page?
Sep 16, 2019 08:28 AM|Mikesdotnetting|LINK
It seems that the feature is built in: https://datatables.net/forums/discussion/41654/how-to-display-a-progress-indicator-for-serverside-processing
Member
527 Points
2729 Posts
Re: How to add loading spinner to a slow loading page?
Sep 16, 2019 11:15 AM|cenk1536|LINK
But I am not using server-side processing.
All-Star
194524 Points
28081 Posts
Moderator
Re: How to add loading spinner to a slow loading page?
Sep 16, 2019 11:35 AM|Mikesdotnetting|LINK
That probably explains why it takes a while. You are generating HTML on the server, sending it to the client, and then getting DataTables to re-render it. It also appears that you are not paging the data on the server. You seem to be getting all data, and then using Datatables to filter it to only show 25 rows? If that is the case, the browser initially renders every row of data. That takes time. Depending on how many rows of data the view initially returns, it could take a lot of time.
Perhaps you should test getting the data as JSON from the server using an AJAX call, and doing the paging on the server.