无法读取属性'长度' of undefined for datatable plugin

时间:2015-10-30 11:28:57

标签: asp.net-mvc datatable

我尝试使用Asp MVC模型在我的Web应用程序上显示数据表,我收到此错误"无法读取属性' length'未定义"

我的HTML:

<table class="table table-striped table-bordered table-hover" id="dataTablesTable">
<thead>
<tr>
 <th>Client</th>
<th>Secteur</th>
<th>Activite</th>
<th>Date</th>
<th>Duree</th>
</tr>
</thead>
<tbody>
</tbody>
</table>

JS:

    $('#dataTablesTable').DataTable({
        bProcessing: true,
        sAjaxSource: '@Url.Action("GetCurrentUserPointage", "Home")'
    });

控制器

public JsonResult GetCurrentUserPointage()
{
    List<POINTAGES> Maliste = new List<POINTAGES>();
    Maliste = Db.POINTAGES.ToList();
    var eventList = from e in Maliste
                    select new
                    {
                        Client = e.CLIENT,
                        Secteur = e.CATEGORIE,
                        Activite = e.SPECIALITE,
                        Date = e.DATE_POINTAGE.ToShortDateString(),
                        Duree = e.DUREE.ToString()
                    };
    var rows = eventList.ToArray();
    return Json(rows, JsonRequestBehavior.AllowGet);
}

2 个答案:

答案 0 :(得分:0)

您需要定义与JSON项目中的哪个属性对应的columns。我还会使用ajax.url而不是弃用sAjaxSource并重置ajax.dataSrc,因为响应是没有命名的项目数组:

$('#dataTablesTable').DataTable({
    bProcessing: true,
    ajax : {
      url : '@Url.Action("GetCurrentUserPointage", "Home")',
      dataSrc : ''
    },
    columns : [
       { data : "Client" },
       { data : "Secteur" },
       { data : "Activite" },
       { data : "Date" },
       { data : "Duree" }
   ]
});

答案 1 :(得分:0)

问题解决后添加:&#34; dataSrc&#34;:&#39;&#39;

$(document).ready(function () {

    $('.dataTables-List').DataTable({
        pageLength: 25,
        dom: '<"html5buttons"B>lTfgitp',
        bProcessing: true,
        "ajax": {
            "url": "/User/GetListUser",
            "type": "GET",
            "datatype": "json",
            "dataSrc": ''
        },                
        "columns": [                     
            { "data": "firstName", "name": "Nombre", "autoWidth": true },
            { "data": "lastName", "name": "Apellido", "autoWidth": true },
            { "data": "userName", "name": "Usuario", "autoWidth": true },
            { "data": "statusID", "name": "statusID", "autoWidth": true }
        ]  ,
        buttons: [
            { extend: 'copy' },
            { extend: 'csv' },
            { extend: 'excel', title: 'ListUser' },
            { extend: 'pdf', title: 'ListUser' },
            {
                extend: 'print',
                customize: function (win) {
                    $(win.document.body).addClass('white-bg');
                    $(win.document.body).css('font-size', '10px');

                    $(win.document.body).find('table')
                            .addClass('compact')
                            .css('font-size', 'inherit');
                }
            }
        ]
    });
});