Footable table timeout when row count is over 1000

Question

I have tried to implement footable pluglin on an MVC application and it currently has 3000+ users which fail to load and the browser page times out. For the User Admin section I have created the following View:

@model IEnumerable<MyBudgetWeb.Models.ApplicationUser>
@{
    ViewBag.Title = "Index";
}

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript">
    $(function () {
        $('.footable').footable();
    });
</script>

<br /><br />
<h2>Bill Pay Users</h2>

<input id="filter" type="text" placeholder="Filter" />
<br /><br />

@if (Model.Count() > 0)
{
    <table class="table" data-filter="#filter" data-page-size="50">
        <thead>
            <tr>
                <th data-type="numeric">Customer Number</th>
                <th data-type="numeric">Account Name</th>
                <th data-type="numeric" data-hide="phone">Go Live Date</th>
                <th data-type="numeric" data-hide="phone">Online Live Date</th>
                <th>Actions</th>
            </tr>
        </thead>

        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>@item.CustomerNumber</td>
                    <td>@item.AccountName</td>
                    <td>@item.GoLiveDate</td>
                    <td>@item.OnlineCreationTimestamp</td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
                        @Html.ActionLink("Details", "Details", new { id = item.Id }) |
                        @*@Html.ActionLink("Delete", "Delete", new { id = item.Id })*@
                    </td>
                </tr>
            }
        </tbody>
        <tfoot class="hide-if-no-paging">
            <tr>
                <td colspan="12" class="text-center">
                    <ul class="pagination"></ul>
                </td>
            </tr>
        </tfoot>
    </table>
}
else
{
    <h2>You are still awaiting users to be added. All users will be displayed here.</h2>
}

My controller looks as follows:

public async Task<ActionResult> Index()
        {
            return View(await UserManager.Users.ToListAsync());
        }

Is there any way workarounds to prevent this?

Answer 1

there are 2 option to solve: 1. PHP Side script, by setting the time limit of execution. Use this code on top your PHP script: set_time_limit(0);

2. Use Footable AJAX what describe here: http://fooplugins.github.io/FooTable/