Таблицы данных не будут перезагружать данные json

Это должно быть не только простой операцией, но я следую документации также. У меня есть вызов ajax, который возвращает набор данных json. Я успешно очистил таблицу, но при вызове метода success ничего не происходит. Оператор console показывает, что данные возвращаются... однако таблица остается пустой. Есть идеи, почему?

JS

    $('#SortByCoverage').click(function () {
        var table = $('#theTable').DataTable();
        table.fnClearTable();

        $.ajax({
            url: '/Home/Question2',
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                console.log(data);                    
                $("#thetable").dataTable({
                    "aaData": data,
                    "aoColumns": [
                        {title:"AdId"},
                        {title:"BrandId"},
                        {title:"BrandName"},
                        {title:"NumPages"},
                        {title:"Position"}
                        ]                        
                });
            }
        });

Код на стороне сервера

    public JsonResult Question2()
    {
        var ads = _client.GetAdDataByDateRange(new DateTime(2011, 1, 1), new DateTime(2011, 4, 1));
        var json = ads.Where(x => x.Position.Equals("Cover") && x.NumPages >= (decimal)0.5).Select(x => new{
            AdId = x.AdId,
            BrandId = x.Brand.BrandId,
            BrandName = x.Brand.BrandName,
            NumPages = x.NumPages,
            Position = x.Position
        });

        return Json(json, JsonRequestBehavior.AllowGet);
    }

Пример данных (на стороне клиента)

введите здесь описание изображения

ИЗМЕНИТЬ

Как указано в комментариях, я неправильно написал имя элемента dataTable в обратном вызове success. Однако теперь я получаю следующую ошибку:

Не удается повторно инициализировать DataTable. Чтобы получить объект DataTables для этой таблицы, не передавайте аргументы или см. документы для bRetrieve и bDestroy.

  1. Мне действительно нужно уничтожить таблицу, как только она будет очищена, чтобы перезагрузить данные?

  2. Я добавил bRetrieve и bDestroy. Это избавило от ошибки, но новые данные по-прежнему не загружены в таблицу.

        $.ajax({
            url: '@Url.Action("Question2", "Home")',
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                console.log(data);
                $("#theTable").dataTable({
                    //"bRetrieve": true,
                    "bDestroy": true,
                    "aaData": data,
                    "aoColumns": [
                        {title:"AdId"},
                        {title:"BrandId"},
                        {title:"BrandName"},
                        {title:"NumPages"},
                        {title:"Position"}
                        ]                        
                });
            }
        });
    

person NealR    schedule 02.12.2015    source источник
comment
В верхней части fn вы выбираете "#theTable", а в своем успехе fn вы выбираете "#thetable" --- это один и тот же элемент? Опечатка?   -  person Josh KG    schedule 02.12.2015
comment
Нет, я идиот, и это опечатка. Спасибо   -  person NealR    schedule 02.12.2015


Ответы (1)


Я бы сделал немного по другому, смотрите как:

var theTable = $("#thetable").dataTable({
    "aaData": [],
    "aoColumns": [
        {data:"AdId"},
        {data:"BrandId"},
        {data:"BrandName"},
        {data:"NumPages"},
        {data:"Position"}
        ]                        
}).DataTable();

$('#SortByCoverage').click(function () {    
        $.ajax({
            url: '/Home/Question2',
            type: 'GET',
            dataType: 'json',
            success: function (data) {
              theTable.clear().draw();
              table.rows.add(data)
                .draw();                    

            }
        });
person Cleiton    schedule 02.12.2015
comment
Это дало мне ошибку Uncaught TypeError: theTable.clear is not a function - person NealR; 02.12.2015
comment
Я неправильно написал #thetable.. и знаете ли вы, какую версию dataTable вы используете? позже обратите внимание, вы должны запустить это на событии готовности jquery. - person Cleiton; 02.12.2015
comment
А, я вижу, в чем дело. В моем сообщении была опечатка, и элемент thetable должен быть theTable. Однако после внесения этого изменения я получаю сообщение об ошибке Cannot reinitialise DataTable. To retrieve DataTables object for this table, pass no arguments or see the docs for bRetrieve and bDestroy - person NealR; 02.12.2015
comment
Извините, измените последнюю таблицу данных на DataTable (заглавные буквы D) (я обновил свой пример) - person Cleiton; 02.12.2015
comment
Мне нужно было добавить bDestroy: true к .dataTable, но это сработало. Спасибо! - person NealR; 10.01.2016