Datatables - как я могу скрыть подробности-контроль Если нет данных для отображения - PullRequest
0 голосов
/ 26 ноября 2018

Я хочу отключить управление сведениями, если данные для отображения отсутствуют.

function format(d) {   
    return d[1];
}

var table = $('#table').DataTable({
    "searching": false,
    "ordering": false,
    "info": false,
    dom: 'frt',
    serverSide: true,
    "pageLength": 4,
    language: {
        "zeroRecords": "..."
    },
    "stripeClasses": [],
    "columns": [
        null,
        null,
        null,
        null,
        {
            "class": "details-control",
            "orderable": false,
            "data": null,
            "defaultContent": ""
        },
        null
    ],
    ajax: $.fn.dataTable.pageLoadMore({
        url: "@Url.Action("Load")"
        }),
    drawCallback: function () {
            $('#btn-Load').toggle(this.api().page.hasMore());
        }
});

// Add event listener for opening and closing details
$('#table tbody').on('click', 'td.details-control', function () {
    var tr = $(this).closest('tr');
    var row = table.row(tr);

    if (row.child.isShown()) {
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    }
    else {
        // Open this row
        row.child(format(row.data())).show();
        tr.addClass('shown');
    }
});

HTML:

<table id="table" class="display" cellspacing="0">
    <thead>
        <tr>
            <th>@Html.LocalResources("A")</th>
            <th></th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

Как скрыть значок дисплея, если в позиции 1 нет данныхпоказывать?Я просматриваю этот сайт: https://datatables.net/examples/api/row_details.html для просмотра API и его работы.

В API DataTables есть несколько методов для присоединения дочерних строк к родительской строке в DataTable.Это можно использовать для отображения дополнительной информации о строке, что полезно в тех случаях, когда вы хотите передать больше информации о строке, чем есть место в таблице хостов.

В приведенном ниже примере используется строка () .child методы, чтобы сначала проверить, отображается ли уже строка, и если это так, скрыть ее (row (). child.hide ()), в противном случае показать ее (row (). child.show ()).Содержимое дочерней строки в этом примере определяется функцией format (), но вы бы заменили ее тем содержимым, которое хотите показать, возможно, включая, например, вызов Ajax на сервер для получения дополнительной информации.

1 Ответ

0 голосов
/ 27 ноября 2018

Вы можете использовать опцию createdRow для обработки события при создании каждой строки и удаления класса details-control из первой ячейки на основе вашего условия.

Например:

"createdRow": function( row, data, dataIndex ) {
   if ( data["position"] === "Software Engineer" ) {
      $("td.details-control", row).removeClass("details-control");
   }
}

См. этот пример для кода и демонстрации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...