Я хочу, чтобы кнопка под моей таблицей отображалась, если у меня есть только 1 запись. Как передать идентификатор записи в таблице при нажатии кнопки?

Question

Вот код chtml для таблицы с моими кнопками там, где я их хочу. Я также включил javascript для таблицы и мой контроллер .cs для кнопки Рисование. Контроллер работает, если я помещаю кнопку в строку таблицы и передаю идентификатор записи по щелчку, но мне не нужна кнопка в строке. Это происходит потому, что кнопка намеренно становится видимой только тогда, когда таблица данных отфильтрована до одной оставшейся записи.

<br />
<div class="container row p-0 m-0">
    <div class="col-6">
        <h2 class="text-info">Device List</h2>
    </div>
    <div class="col-12 border p-3">
        <table id="DT_load" class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>Drawing File</th>
                    <th>Barcode</th>
                    <th>Date Modified</th>
                    <th>Location</th>
                    <th></th>
                </tr>
            </thead>
        </table>

    </div >
    <div class="row" >
        <a asp-action="Drawing" class="btn-primary" id="btn1" style="width: 100px" value="0">
            View Drawing
        </a>
        <a asp-action="Location" class="btn-primary" id="btn2" style="width: 100px">
            View Location
        </a>
    </div>
</div>

, а вот мой javascript

$(document).ready(function () {
    loadDataTable();
});


function loadDataTable()
{
    dataTable = $('#DT_load').DataTable
    ({
        "ajax":
        {
            "url": "/devices/getall/",
            "type": "GET",
            "datatype": "json"
        },
        "columns":
        [
            { "data": "dwgfilename", "width": "20%" },
            { "data": "barcode", "width": "20%" },
            { "data": "moddate", "width": "20%" },
            { "data": "locationdwg", "width": "20%" },
            {
                "data": "id",
                "render": function (data)
                {
                    return `<div class="text-center">
                        /*ignore*/
                        </div>`;
                }, "width": "60%"
            }
        ],

        'infoCallback': function (settings, start, end, max, total, pre)
            {
                if (total == 1)
                {    
                    $("#btn1").show();
                    $("#btn2").show();
                    return 'Showing your record';
                }
                else 
                {
                    $("#btn1").hide();
                    $("#btn2").hide();
                    return 'Showing ' + total + ' of ' + max + ' records';
                }
            },

        "width": "100%"
    });
}

здесь находится контроллер для кнопка

public IActionResult Drawing(int id)
        {
            //draw
            Device = _db.Devices.FirstOrDefault(u => u.Id == id);
            if (Device == null)
            {
                return NotFound();
            }
            var filename = Device.Dwgfilename;
                var stream = new FileStream(@"c:\users\boxworks\documents\" + filename +".pdf", FileMode.Open);
                return new FileStreamResult(stream, "application/pdf");

        }

Answer 1

См. Приведенную ниже рабочую демонстрацию и внесите изменения в свой javascript:

function loadDataTable() {
        dataTable = $('#DT_load').DataTable
            ({
                "ajax":
                {
                    "url": "/home/getall/",
                    "type": "GET",
                    "datatype": "json",
                    "dataSrc":""
                },
                "columns":
                    [
                        { "data": "orderNumber" },
                        { "data": "orderDate" },
                        { "data": "description" },
                        {
                            "data": "orderId",
                            "render": function (data) {
                                return `<lable hidden>`+data+'</lable>';
                            }, "width": "60%"
                        }
                    ],

                'infoCallback': function (settings, start, end, max, total, pre) {
                    if (total == 1) {
                        var id = $("#DT_load tbody tr").find("lable").text();

                        $("#btn1").attr("href",$("#btn1").attr("href") + "?id=" + id);
                        $("#btn1").show();
                        $("#btn2").show();
                        return 'Showing your record';
                    }
                    else {
                        $("#btn1").hide();
                        $("#btn2").hide();
                        return 'Showing ' + total + ' of ' + max + ' records';
                    }
                },

                "width": "100%"
            });
    }

Результат: