C# 将单击事件绑定到单元格中的按钮

我无法将单击事件绑定到单元格中的按钮。 该表最初通过razor代码填充

enter code here<table class="table table-bordered" id="requestTable">
        <thead>
            <tr>
                <th class="dynatable-header">
                    Request ID
                </th>
                <th class="dynatable-header">
                    Caller ID
                </th>
                <th class="dynatable-header">
                    Result Code
                </th>
                <th data-dynatable-column="address1And2" class="dynatable-header">
                    Address 1 &amp; 2
                </th>
                <th class="dynatable-header">
                    City
                </th>
                <th class="dynatable-header">
                    State
                </th>
                <th class="dynatable-header">
                    Zip
                </th>
                <th class="dynatable-header">
                    Request Date
                </th>
                <th data-dynatable-column="requestTime" class="dynatable-header">
                    Request Time (ms)
                </th>
                <th data-dynatable-column="moreInfo" class="dynatable-header">

                </th>
            </tr>
        </thead>
        <tbody>
            @foreach (AdminRequest request in this.Model)
            {
                <tr>
                    <td>
                        @request.RequestID
                    </td>
                    <td>
                        @request.CallerID
                    </td>
                    <td>
                        @request.ResultCD
                    </td>
                    <td>
                        @(request.AddressLine1 + " " + request.AddressLine2)
                    </td>
                    <td>
                        @request.City
                    </td>
                    <td>
                        @request.State
                    </td>
                    <td>
                        @request.ZipCode
                    </td>
                    <td>
                        @request.RequestDate
                    </td>
                    <td>
                        @(request.RequestMS.HasValue ? request.RequestMS.Value : 0)
                    </td>
                    <td>
                        <!--button goes here-->
                    </td>
                </tr>
            }
        </tbody>
    </table>

在此处输入代码
请求ID
主叫号码
结果代码
地址1&；2.
城市
状态
拉链
申请日期
请求时间（毫秒）
@foreach（此.Model中的AdminRequest请求）
{
@request.RequestID
@request.CallerID
@request.ResultCD
@（request.AddressLine1+“”+request.AddressLine2）
@请求。城市
@请求，陈述
@request.ZipCode
@request.RequestDate
@（request.RequestMS.HasValue？request.RequestMS.Value:0）
}

我通常会在单元格中填充一个动作链接，将我推到另一个页面，但我希望一个按钮显示一个弹出窗口。因此，我需要在表中动态绑定按钮，这些按钮可以访问行的数据，以便在单击时调用web服务以获取其余数据。我已经厌倦了使用jQuery数据表，我想我会尝试一些新的东西并使用动态表

填充后，我调用表上的dynatables。 我已经编写了一个自定义行读取器来去除数据中的空白等

$("#requestTable").dynatable({
        features: {
            pushState: false //stop firefox from erroring on the character limit
        },
        readers:{
            _rowReader: function (index, tr, record) {
                record.requestId = record.requestId.trim();
                record.callerId = record.callerId.trim();
                record.resultCode = record.resultCode.trim();
                record.address1And2 = record.address1And2.trim();
                record.city = record.city.trim();
                record.state = record.state.trim();
                record.zip = record.zip.trim();
                record.requestDate = record.requestDate.trim();
                record.requestTime = record.requestTime.trim();
                record.moreInfo = "<button type='button' class='btn btn-primary'>More Info</button>";
            }
        },
        writers: {
            "moreInfo": function (record, tr) {
                var button = record.moreInfo;
                $(button).on("click", function () {
                    alert("hello");
                });
                return button;
            }
        }
    });

$（“#请求表”）.dynatable({
特点：{
pushState:false//停止firefox在字符限制上出错
},
读者：{
_行读取器：函数（索引、tr、记录）{
record.requestId=record.requestId.trim（）；
record.callerId=record.callerId.trim（）；
record.resultCode=record.resultCode.trim（）；
record.address1And2=record.address1And2.trim（）；
record.city=record.city.trim（）；
record.state=record.state.trim（）；
record.zip=record.zip.trim（）；
record.requestDate=record.requestDate.trim（）；
record.requestTime=record.requestTime.trim（）；
record.moreInfo=“更多信息”；
}
},
作者：{
“moreInfo”：功能（记录，tr）{
var按钮=record.moreInfo；
$（按钮）。打开（“单击”，函数（）{
警惕（“你好”）；
});
返回按钮；
}
}
});

这会呈现按钮，但不会附加事件处理程序。 你知道我做错了什么吗

---

提前谢谢

您可以尝试替换下面的行

更多信息

下面的行

然后，您可以将事件附加到它上，如下所示

函数处理程序（）{alert（'hello'）；}
$（'.btn btn primary'）.append（函数（）{
返回$（“更多信息”）。单击（处理程序）；
})

解决方案 在四处修补之后，我找到了一个像样的解决办法

现在，我开始渲染循环中的按钮

我添加了下面的函数

var bindClicks = function () {
        var data = $("#requestTable").data("dynatable");
        $.each(data.settings.dataset.records, function (index, item) {
            var tr = $("#requestTable tbody tr").eq(index);
            $(":last-child", tr).addClass("moreInfoButton");
            $(".moreInfoButton > button", tr).on("click", function () {
                console.log("test");
            });
        });
  };

该函数基本上获取我们正在迭代的当前tr，然后继续获取该tr中的最后一个td。这样我可以搜索按钮，并将click函数绑定到它

为了执行此函数，我将表定义编辑为如下所示

var dynatable = $("#requestTable").dynatable({
        features: {
            pushState: false 
        },
        table: {
            readers: {
                testReader: function (index, columns, record) {
                    record.requestId = record.requestId.trim();
                    record.callerId = record.callerId.trim();
                    record.resultCode = record.resultCode.trim();
                    record.address1And2 = record.address1And2.trim();
                    record.city = record.city.trim();
                    record.state = record.state.trim();
                    record.zip = record.zip.trim();
                    record.requestDate = record.requestDate.trim();
                    record.requestTime = record.requestTime.trim();
                }
            }
        }

    }).bind("dynatable:afterProcess", bindClicks);

    dynatable.data("dynatable").process();

---

请随时改进我的答案。

正在将“moreInfo”添加到writers函数中，但我不相信会调用它。正如这里提到的（）您的函数将被添加到writer中，但您需要从现有函数之一调用它才能执行。请参阅下面的链接，它已经实现了与delete相同的功能。这不符合我的需要。与数据属性“moreInfo”绑定的每个单元格都需要有一个按钮，该按钮具有单独绑定的单击功能。jQuery代码附加了一个click处理程序，该处理程序向具有类btn和btn primary的每个按钮发出hello警报。谢谢你的尝试。