首页 > 解决方案 > ASP.NET MVC 中的数据表自动刷新

问题描述

如您所见,我的视图中有这张表:

<table id="DataTable" class="table table-condensed">
    <thead>
        <tr class="headings">
            <th >نام و نام خانوادگی </th>
            <th></th>
            <th>وقت ملاقات </th>
            <th>ملاقات شونده </th>
            <th>زمان ورود </th>
            <th>زمان خروج </th>
            <th>عملیات</th>
        </tr>
    </thead>
    <tbody>
    @foreach (ReferralTrafficView item in Model)
    {
    }
    </tbody>
</table>

这是我的数据表配置:

<script>
    $(document).ready(function () {
        $('#DataTable').DataTable({
            "paging": true,
            "pageLength": 10,
            "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "همه"]],
            "ordering": true,
            "processing": true,
            "info": true,
            "dom": "<'row'<'col-md-6 text-right'f><'col-md-6 text-left'>>"
            + "<'row'<'col-md-12'tr>>" +
            "<'row'<'col-md-5 text-right rtl'p> <'col-md-7 text-left'i>>",
            "language": {
                "search": "_INPUT_",
                "searchPlaceholder": "جستجو...", "sLoadingRecords": "در حال دریافت اطلاعات...", "sProcessing": "در حال پردازش...",
                "lengthMenu": "نمایش _MENU_ ردیف در هر صفحه",
                "zeroRecords": "موردی یافت نشد!",
                "info": "نمایش صفحه _PAGE_ از _PAGES_",
                "infoEmpty": "داده قابل نمایش موجود نیست.",
                "infoFiltered": "(_TOTAL_ مورد از کل _MAX_ یافت شد)",
                "oPaginate": {
                    "sNext": "<i class='fa fa-angle-left'></i>",
                    "sPrevious": "<i class='fa fa-angle-right'></i>"
                }
            }

        });
    });

</script>

我在模型中的数据每次都会更改,我想刷新我的数据表而不刷新。这是我的控制器:

 public ActionResult MyReception(string Id)
        {

            List<ReferralTrafficView> rf = new List<ReferralTrafficView>();
get data from database
return rf
}

我可以在数据表配置中设置控制器以自动获取数据并刷新数据而不重新加载页面吗?

标签: asp.net-mvcdatatables

解决方案


您必须让您的 DataTable 从 ajax 源收集数据。DataTables 允许您配置将检索表内容的服务器端端点的 URL。然后添加一个 onclick 调用函数 table.ajax.reload() 的按钮。此外,您可能希望使用 setInterval() 定期自动调用此函数。

检查有关设置ajax 源ajax 重新加载功能的文档。

另一种选择是更新表格的数据部分并重新绘制网格。 https://datatables.net/reference/api/draw()


推荐阅读